1. 如何让 IE9 以下的浏览器支持 css3 的media query 需要用到的 min-width/max-width 属性

css3 的媒体查询 IE 浏览器的支持程度是从 IE9开始支持,那么要想 IE6~IE8 的浏览器支持 媒体查询可以使用 js 来辅助支持。主要可以使用以下两个 辅助 js 文件中的其中一个即可:

1). respond.js

    可以从:http://www.bootcdn.cn/respond.js/ 上 通过 cdn 引入

  2).css3-mediaqueries.js

可以上 github 上下载然后引入;

对于使用上述的两个 pollify 文件,其优缺点可以在链接:http://stackoverflow.com/questions/12837568/css3-mediaqueries-js-vs-respond-js 看到详细对比。

2. 如和在页面中引入上述两个文件

  为了减少页面的 http 请求数量,对于支持 css3 媒体查询的浏览器,则不引入上述的 js 文件,反之则引入。那么如何做到呢,可以参考文章:

http://www.cnblogs.com/thinkingthigh/archive/2013/06/19/3144239.html

3. 有时候会发现,引入了 respond.js, 但是却并没有实现 css3的媒体查询效果呀,这怎么解决呢?可以参考文章:

http://www.cnblogs.com/aimyfly/p/4286626.html

让 IE9 以下的浏览器支持 Media Queries的更多相关文章

  1. IT兄弟连 HTML5教程 设置IE9以下版本浏览器支持HTML5

    HTML2.HTML5刚发布时由于各浏览器之间的标准不统一,开发者的时间都浪费在解决Web浏览器之间的兼容性上.但由于W3C和WHATWG对HTML5新版本的制定,以及近年来对HTML5的使用,再加上 ...

  2. 【CSS3 入门教程系列】CSS3 Media Queries 实现响应式设计

    在 CSS2 中,你可以为不同的媒介设备(如屏幕.打印机)指定专用的样式表,而现在借助 CSS3 的 Media Queries 特性,可以更为有效的实现这个功能.你可以为媒介类型添加某些条件,检测设 ...

  3. HTML5实践 -- 使用CSS3 Media Queries实现响应式设计

    CSS3 Media用法介绍:http://www.w3cplus.com/content/css3-media-queries 转载请注明原创地址:http://www.cnblogs.com/so ...

  4. css3的媒体查询(Media Queries)

    我今天就总结一下响应式设计的核心CSS技术Media(媒体查询器)的用法. 先看一个简单的例子: <link rel="stylesheet" media="scr ...

  5. CSS3学习教程:Media Queries详解

    说起CSS3的新特性,就不得不提到 Media Queries . Media Queries 的引入,其作用就是允许添加表达式用以确定媒体的情况,以此来应用不同的样式表.换句话说,其允许我们在不改变 ...

  6. CSS3 Media Queries 详解

    说起CSS3的新特性,就不得不提到 Media Queries .最近 Max Design 更新的一个泛读列表里,赫然就有关于 Media Queries 的文章.同时位列其中的也有前天我刚刚翻译的 ...

  7. CSS3的媒体查询(Media Queries)与移动设备显示尺寸大全

    媒体查询介绍 我今天就总结一下响应式设计的核心CSS技术Media(媒体查询器)的用法. 先看一个简单的例子: <link rel="stylesheet" media=&q ...

  8. 【css】CSS3 Media Queries 详解【转】

    说起CSS3的新特性,就不得不提到 Media Queries .最近 Max Design 更新的一个泛读列表里,赫然就有关于 Media Queries 的文章.同时位列其中的也有前天我刚刚翻译的 ...

  9. 第11章 Media Queries 与Responsive 设计

    Media Queries--媒体类型(一) 随着科学技术不断的向前发展,网页的浏览终端越来越多样化,用户可以通过:宽屏电视.台式电脑.笔记本电脑.平板电脑和智能手机来访问你的网站.尽管你无法保证一个 ...

随机推荐

  1. BZOJ2796[Poi2012]Fibonacci Representation——贪心+二分查找

    题目描述 给出一个正整数x,问x最少能由多少个Fibonacci数加减算出. 例如1070=987+89-5-1,因此x=1070时答案是4. 输入 第一行一个正整数q (q<=10),表示有q ...

  2. HDU4296-ChengduOnling-贪心

    某人要搬砖盖一栋楼,有m块砖,每块有两个值w和s,表示重量和强度.楼盖好后每块砖有一个危险值,表示为此砖之上的砖的重量和减此砖的强度,即Σ0(j-1)w - sj. 整体危险值是每块砖危险值的最大值. ...

  3. cf379F New Year Tree (树的直径+倍增lca)

    可以证明,如果合并两棵树,新的直径的端点一定是原来两树中直径的端点 可以把新加两个点的操作看成是把两个只有一个点的树合并到原来的树上,然后用其中的一个点去和原来树上的直径两端点更新直径就可以了 #in ...

  4. 树莓派上使用Slowloris进行DDoS攻击

    安装Slowloris工具 git clone https://github.com/gkbrk/slowloris.git 使用Slowloris进行攻击 进入Slowloris文件夹.cd slo ...

  5. A1022. Digital Library

    A Digital Library contains millions of books, stored according to their titles, authors, key words o ...

  6. 【洛谷P1972】HH的项链 离线+树状数组

    题目大意:静态查询序列区间颜色数. 题解:对于一个查询区间 [l , r] ,若有两个相同颜色的点在这个区间中,则总是取下标靠近端点 r 的颜色计入答案贡献.对于每个下标,记录下在这个下标之前,且距离 ...

  7. 走进JVM之一 自己编译openjdk源码

    想要深入了解JVM,就必须了解其实现机制.了解JVM实现的最好方法便是自己动手编译JDK.好了,让我们开始吧! 1.  准备工作 获取OpenJDK源码 本次编译选择的是OpenJDK7u,官方源码包 ...

  8. Vue初学者可能不知道的坑

    1.setTimeout/ setInterval 场景一 :this指向改变无法用this访问vue实例 mounted(){ setTimeout( function () { //setInte ...

  9. Codeforces Round #419 (Div. 2)(B)差分数组

    传送门:Problem B https://www.cnblogs.com/violet-acmer/p/9721160.html 题意: Karen有n个关于煮咖啡的食谱,每个食谱都有个煮咖啡的最适 ...

  10. JS面试题(一)

    1.JS六种基本数据类型:string Boolean number object undefined function typeof返回的是字符串,有六种:string Boolean number ...