让 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的媒体查询效果呀,这怎么解决呢?可以参考文章: