ie浏览器不兼容css媒体查询的解决办法


有些页面布局复杂,在不同分辨率下表现需要一致,这时需要用媒体查询根据不同分辨率进行百分比定位(不能用像素定位),如:

 1 @media screen and (max-width: 1600px) {
 2     .body {
 3         left: 22.5%
 4     }
 5     .bd-right {
 6         left: 65.5%;
 7     }
 8     .roll {
 9         left: 19.5%;
10     }
11 }
12 
13 @media screen and (max-width: 1440px) {
14     .body {
15         left: 18.5%
16     }
17     .bd-right {
18         left: 67.5%;
19     }
20     .roll {
21         left: 15.5%;
22     }
23 }

ie8不支持媒体查询,可以用respond.js库解决,但需要注意以下几点:

1、需要启动本地服务器(localhost),不能使用普通本地的url地址(file://开头);
2、需要外部引入CSS文件,将CSS样式书写在style中是无效的;
3、由于respond插件是查找CSS文件,再进行处理,所以respond文件一定要放置在CSS文件的后面
4、另外,虽然把respond放置在head里还是在body后面都能够实现,但是建议放置在head中(具体原因在下面的文档提示中有提到)
5、最好不要为CSS设置utf-8的编码,使用默认(原因详见下面的文档提示部分)


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM