解决办法:引入Respond.js让IE6-8支持CSS3 Media Query

使用方式

参考官方demo:http://scottjehl.github.com/Respond/test/test.html

1.在css中正常用 min/max-width media queries

@media screen and (min-width: 480px){
...styles for 480px and up go here
}

2.引入respond.min.js,但要在css的后面(越早引入越好,在ie下面看到页面闪屏的概率就越低,因为最初css会先渲染出来,如果respond.js加载得很后面,这时重新根据media query解析出来的css会再改变一次页面的布局等,所以看起来有闪屏的现象)

参考链接:Respond.js让IE6-8支持CSS3 Media Query

下载地址:https://github.com/scottjehl/Respond

ie8及其以下版本兼容性问题之响应式的更多相关文章

  1. 探讨兼容IE低版本的PC端响应式布局

    http://www.jiangweishan.com/article/lowIeResposive.html 响应式布局,oh my god!!有点醉了,感觉是老生常谈的话题了.虽然已经谈过很多了, ...

  2. ie8及其以下版本兼容性问题之placeholder实现

    1. 普通浏览器下修改placeholder颜色 因为每个浏览器的CSS选择器都有所差异,所以需要针对每个浏览器做单独的设定. 示例: input::-webkit-input-placeholder ...

  3. ie8及其以下版本兼容性问题之input file隐藏上传文件

    文件上传时,默认的file标签很难看,而且每个浏览器下都有很大差距.因此我们基本都把真正的file标签给隐藏,然后创建一个标签来替代它.但是由于IE出于安全方面的考虑上传文件时必须点击file的浏览按 ...

  4. ie8及其以下版本兼容性问题之圆角

    解决办法:在http://css3pie.com/页面下载一个PIE.htc的文件,加载到根目录下,然后在css中加上一句behavior:url(../js/PIE.htc);如下: .border ...

  5. ie8及其以下版本兼容性问题之文本省略

    1. 单行文本省略 单行文本省略适用于文本超出内容显示区,则在末尾显示省略号 1.1 普通文本超出省略 普通文本超出显示省略号,示例: .p{ height: 30px line-height: 30 ...

  6. picturefill + picture 标签 实现兼容性很棒的 响应式图片 自适应 屏幕大小

    polyfill 它是一个能够补齐浏览器兼容性问题的一个东西,使用到的<picture></picture>标签 ,并不是所有浏览器都支持,为了实现更好的兼容效果,这里就使用到 ...

  7. Vue响应式变化

    Vue有一个很方便的特性就是Vue的双向绑定,即响应式变化,在Vue2.X版本中,Vue响应式变化靠的是Object.defineProperty方法实现的,但是这个方法有个问题,就是对数组的支持不全 ...

  8. JuCheap V2.0响应式后台管理系统模板正式发布beta版本

    JuCheap V1.* 查看地址: http://blog.csdn.net/allenwdj/article/details/49155339 经过半年的努力,JuCheap后台通用响应式管理后台 ...

  9. 响应式布局中重要的meta标签设置.适用于手机浏览器兼容性设置

    <!-- #手机浏览器兼容性设置 -->    <meta content="application/xhtml+xml;charset=UTF-8" http- ...

随机推荐

  1. time、datatime模块

    python中时间日期格式化符号 %Y 年份(4位数表示) %y 年份(2位数表示) %m 月份(01-12) %d 月内中的一天(0-31) %H 24小时制小时数 %I 12小时制小时数 %M 分 ...

  2. 优化JAVA查询Mongodb数量过大,查询熟读慢的方法

    前言:2018年的时候优化了一个项目,该项目从MOngodb中获取数据的时候一次去十万百万千万的数据过慢,往往每次都要二十秒,三十秒,今天提出了一个代码优化的方案 项目查从mongodb中获取数据:代 ...

  3. webstorm下ES6转ES5

    ECMAScript 6是JavaScript语言的下一代标准,已经在2015年6月正式发布了.Mozilla公司将在这个标准的基础上,推出JavaScript 2.0. ES6的目标,是使得Java ...

  4. wx微信小程序

    俩三行时: ==========

  5. unigui菜单【3】

    unigui菜单TuniTreeView 根据数据库表中的内容,显示菜单的处理: function TMainForm.CreateMenu: Integer; var myMenuPoint : P ...

  6. ZOJ 5579 Stean

    Stean Time Limit: 1 Second      Memory Limit: 65536 KB      Special Judge Tom is good at making stea ...

  7. Jmeter 学习imooc

    https://www.imooc.com/video/14718 1. BS Vs CS BS架构: browser server CS架构: Client server(安装到本地)

  8. nyoj_289_苹果_20140307

    苹果 时间限制:3000 ms  |  内存限制:65535 KB 难度:3   描述 ctest有n个苹果,要将它放入容量为v的背包.给出第i个苹果的大小和价钱,求出能放入背包的苹果的总价钱最大值. ...

  9. [bzoj2086][Poi2010]Blocks_单调栈_双指针

    Blocks bzoj-2086 Poi-2010 题目大意:题目链接. 注释:略. 想法:首先,不难发现,如果连续的一段数的平均值不小于输入的k的话,这段数是满足题意的. 所以,我们再次简化一下:将 ...

  10. 记录cocos2d-x3.0版本号更改内容官方说明

    http://www.cocos2d-x.org/wiki/Release_Notes_for_Cocos2d-x_v300