Question

我的响应式网站和Internet Explorer出现了问题（上图），我想知道是否有人可以查看nickpassaro.com标题中的源代码并帮我弄清楚为什么IE9和IE8不正常。我不确定这是否是我的CSS的问题，因为我的所有三个样式表都具有通用性的某些属性不起作用（如标题的背景）。

我正在使用html5shiv作为我的polyfill，它不是来自我服务器上的本地副本。我也使用normalize.css，它表示它适用于IE8 +

谢谢

Answer 1

https://github.com/scottjehl/Respond

如果您正在寻找更强大的CSS3媒体查询支持，可以查看http://code.google.com/p/css3-mediaqueries-js/。在测试中，我发现在渲染复杂的响应式设计（文件大小和性能）时，脚本会明显变慢，但它确实支持比这个脚本更多的媒体查询功能。给作者的大帽子提示！：）

Answer 2

有两种不同的方法，你可以使用一些jquery或JS for IE这样的版本

function adjustStyle(width) {
    width = parseInt(width);
    if (width < 701) {
        $("#size-stylesheet").attr("href", "css/narrow.css");
    } else if ((width >= 701) && (width < 900)) {
        $("#size-stylesheet").attr("href", "css/medium.css");
    } else {
       $("#size-stylesheet").attr("href", "css/wide.css"); 
    }
}

或者您可以为不同的IE版本编写不同的CSS 对于IE的所有版本

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

针对特定版本

<!--[if IE 7]>
    <link rel="stylesheet" type="text/css" href="ie7.css">
<![endif]-->

IE中的媒体查询

2 个答案: