浏览器不支持CSS3Media Query怎么办?

怎么解决?... 怎么解决? 展开
 我来答
厦门言成
2018-07-12 · TA获得超过4947个赞
知道小有建树答主
回答量:121
采纳率:97%
帮助的人:134万
展开全部

IE6~8不支持CSS3 Media Query,需要借助respond.js插件。

respond.js插件下载地址:https://www.developgeek.com/plus/list.php?tid=62

demo.css 样式文件

html,body {
    height: 100%;
}
@media only screen and (min-width: 480px){
    body {
        background: yellow;
    }
}
@media only screen and (min-width: 640px) and (max-width: 1024px) {
    body {
        background: green;
    }
}
@media screen and (min-width: 1024px){
    body {
        background: blue;
    }
}

respond.js demo实例

<!doctype html>
<html>
<head>
    <meta charset="UTF-8">
    <title>HTML5-响应式布局--respond.js-言成科技&HTML5学堂</title>
    <link rel="stylesheet" type="text/css" href="demo.css" />
    <script src="respond.min.js"></script>
</head>
<body>
    <div class="wrap" id="con">
    让IE6~8支持响应式布局——言成科技&HTML5学堂
    </div>
</body>
</html>

注意:respond.min.js或者respond.src.js都可以使用,在上面给出的下载地址中下载即可。

IE6的显示效果

Tips:IE7-8的显示效果也是没有问题的,在此就不贴图处理了

推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式