让 IE9 以下的浏览器支持 Media Queries

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

posted @ 2015-09-07 18:59  张小喵  阅读(1131)  评论(0编辑  收藏  举报