html link "media" 属性(ie8)

html link "media" attribute (ie8)

此问题与IE8严格相关,我理解CSS3 @media 查询。

希望根据浏览器宽度切换样式表,我的代码如下:

<link rel="stylesheet" type="text/css" href="small.css" media="screen and (min-width: 1000px)">
<link rel="stylesheet" type="text/css" href="large.css" media="screen and (min-width: 1200px)"> 

(对于 simplicity/clarity - 样式表只是改变框的颜色)

现在上面的代码在每个浏览器中都可以正常工作,当然除了 IE8....

做了一些研究以确保它不是兼容性问题,我发现 IE8 support html media 属性....

问题:为什么这不适用于 POS IE8?

IE9 之前的 Internet Explorer 版本不支持媒体查询。

如果您正在寻找一种降低 IE8 用户设计的方法,您可能会发现 IE 的条件注释很有帮助。使用它,您可以指定一个 IE 8/7/6 特定样式 sheet 覆盖以前的规则。

例如:

<link rel="stylesheet" type="text/css" media="all" href="style.css"/>
<!--[if lt IE 9]>
<link rel="stylesheet" type="text/css" media="all" href="style-ie.css"/>
<![endif]-->

还有一个 javascript 插件,用于在本机不支持的浏览器中支持媒体查询:

http://code.google.com/p/css3-mediaqueries-js/