web适配问题

bootstrap模板为使IE6、7、8版本（IE9以下版本）浏览器兼容html5新增的标签，引入下面代码文件即可。

<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>

同理为使IE6、7、8版本浏览器兼容css3样式，引入下面代码：
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>

移动端适配问题:

<meta name="viewport" content="width=device-width, initial-scale=1">

web端兼容IE浏览器版本问题:

<meta http-equiv="X-UA-Compatible" content="IE=edge">

时间： 2024-08-10 17:17:44

web适配问题的相关文章

移动端web适配屏幕方案总结

基础知识点 设备像素:设备像素又称物理像素(physical pixel),设备能控制显示的最小单位,我们可以把这些像素看作成显示器上一个个的点. iPhone5的物理像素是640X1136. PS:在普通屏幕下,1个css像素对应1个物理像素(1:1).        在超高像素密度屏幕(Retina显示屏)下,1个css像素对应4个物理像素(1:4).(这里指专指苹果超高清屏幕)        因此,在移动端方面就需要设置dpr来保证超高清屏显示图片不会失真. 逻辑像素( logical p

移动web适配利器-rem

移动web适配利器-rem 前言 提到rem,大家首先会想到的是em,px,pt这类的词语,大多数人眼中这些单位是用于设置字体的大小的,没错这的确是用来设置字体大小的,但是对于rem来说它可以用来做移动端的响应式适配哦. 兼容性 先看看兼容性,关于移动端 ios:6.1系统以上都支持 android:2.1系统以上都支持 大部分主流浏览器都支持,可以安心的往下看了. rem设置字体大小 rem是(font size of the root element),官方解释 , 意思就是根据网页的根元素

[转]再谈移动端Web屏幕适配

一个多月前水了一篇移动web屏幕适配方案,当时噼里啪啦的写了一通,自我感觉甚是良好.不过最近又有一些新的想法,和之前的有一些不同. 先说一下淘宝的方案,感觉现在好多的适配方案都是受了它的影响,上周六看了winter在一个会议的分享,讲到了这个方案.现在你谷歌一下移动web适配,绝对可以看到很多类似的,切活动页的童鞋都忍不住试一把.这些方案和我的博客写的其实还是相似的,就是抛弃了那种viewport直接缩放,然后给定html的初始font-size值,使用rem这个单位. 在屏幕的设备像素比上,也

web屏幕适配方案

一个多月前水了一篇移动web屏幕适配方案,当时噼里啪啦的写了一通,自我感觉甚是良好.不过最近又有一些新的想法,和之前的有一些不同. 先说一下淘宝的方案,感觉现在好多的适配方案都是受了它的影响,上周六看了winter在一个会议的分享,讲到了这个方案.现在你谷歌一下移动 web适配,绝对可以看到很多类似的,切活动页的童鞋都忍不住试一把.这些方案和我的博客写的其实还是相似的,就是抛弃了那种viewport直接缩放, 然后给定html的初始font-size值,使用rem这个单位. 在屏幕的设备像素比上

浅谈Web自适应

浅谈Web自适应 2016-08-13 前端大全 前端大全 (点击上方公众号,可快速关注我们) 来源:卖烧烤夫斯基 链接:www.cnblogs.com/constantince/p/5708930.html 前言 随着移动设备的普及,移动web在前端工程师们的工作中占有越来越重要的位置.移动设备更新速度频繁,手机厂商繁多,导致的问题是每一台机器的屏幕宽度和分辨率不一样.这给我们在编写前端界面时增加了困难,适配问题在当下显得越来越突出.记得刚刚开始开发移动端产品的时候向设计MM要了不同屏幕的设计

移动端适配方案-rem(基础篇)

常见移动web适配方案一般有3种方法,如下图: ①:定高,宽度百分比(百分比适配简单,一般用来做一些适配性不高的页面,比如只有一些文字和图片等简单的屏幕适配) ②:flex (更多的用于复杂页面的布局.具体参照阮一峰大神写的-Flex 布局教程:语法篇和实例篇 http://www.ruanyifeng.com/blog/2015/07/flex-grammar.html?utm_source=tuicool   (语法篇) http://www.ruanyifeng.com/blog/2015

2017年4月笔记

天猫团队开源跨平台模块化UI界面开发框架Tangram https://github.com/alibaba/Tangram-Android https://news.cnblogs.com/n/566196/ 前端资源链接收藏 https://yq.aliyun.com/articles/53371?utm_content=m_15575 一款服务器端渲染 Vue 框架 https://cn.nuxtjs.org/ 一款非常不错的服务器端 React 渲染框架 https://github.c

电子商务系统的设计与实现(十二)：技术选型

Web前端 最标准化的3项技术:HTML.JavaScript.CSS.   其中,HTML主要使用4,JS框架主要使用jquery,CSS框架主要使用Bootstrap. 好处: 简单易学,没有什么学习成本.最标准化的技术,在一个项目中积累经验,在另外一个项目中也可以持续使用.  而Angular等前端框架,不太熟悉,是否有较广泛的适用场景.今后可以考虑学习下. 后端管理系统,前端采用开源的dwz框架,表格分页组件使用自己写的,其它菜单.对话框等常用组件使用dwz自带的.后端渲染界面,而非前端

Vue.js+Koa2移动电商实战3

移动端屏幕适配基础 制作webapp时一个很关键的问题就是适配各种机型不同屏幕的大小,让每种机型上的布局看起来都尽量一样,这让很多小伙伴很是头疼.在这里我介绍一下我平时工作中常用的适配方案,当然适配方案有很多种,所以你有更好的方法,也可以使用或者大家一起交流. 常见移动web布局适配方法 固定高度,宽度百分比:这种方法只适合简单要求不高的webApp,几乎达不到大型项目的要求,属于过时的方法. Media Query(媒体查询):现在比较主流的适配方案,比如我们常用的样式框架Bootstrap就