IE8 没有呈现正确的响应内容答案

【问题标题】：IE8 not rendering correct responsive contentIE8 没有呈现正确的响应内容
【发布时间】：2014-04-29 14:05:33
【问题描述】：

IE8 开发工具的样式检查器显示@media 查询已经工作（respond.min.js 和 html5shiv），并且正确的背景图像和 div 高度取自与@media 查询相应的 css 文件

但是……

布局检查器显示一个高度错误的框。网页本身在错误大小的框中显示错误的背景图像。

该页面在 webkit 浏览器中正常显示，但在 IE8 中无法正常显示。

这是一个“桌面优先”的响应式设计：large.css 总是在 small.css 之前加载，而 small.css 仅适用于 @media 查询 - IE8 选择显示的背景图像和框来自 large.css .. .

...即使 IE8 开发人员工具的样式检查器显示大 bg 图像得分通过并且正确选择了小图像 url。

我已经尝试了六种或更多的 CSS 和 JavaScript hack 来尝试让 IE8 重新绘制页面； DOCTYPE 指定了 HTML5 等等……但 IE8 仍然不会绘制 DOM 中显示的内容。

[自原始问题更新...]

问题可以在 [URL 编辑] 中看到，在 IE8 中，当屏幕尺寸较小或中等时，开发者工具搜索 id="hero"。你会看到：

这表明 respond.js 正在正确模拟 @media 查询并为屏幕宽度选择正确的 css 文件，但 IE8 在检测到更改后并未重新绘制屏幕。

【问题讨论】：

IE8 不支持媒体查询？
@adeneo 不，它没有。
让我们看看一些代码或链接
伙计们，他说他正在使用Respond，这是一个用于支持旧浏览器的媒体查询的polyfill。 @iainH 如果您在开发工具中取消勾选正确的 css 属性，然后重新勾选它，它会自行修复吗？是否有机会提供该错误的演示？
可能是因为每个浏览器都有自己的默认样式。我看到您没有使用 CSS 重置或规范化。我建议你尝试使用normalize.css。

【解决方案1】：

我怀疑这是否会成为每个人的答案，我希望其他地方对此有很多讨论，但这是我的想法和结论：

我将提醒 IE8 访问者和 XP 访问者，该网站只能在 Windows XP 上也可用的更现代的浏览器中查看，但如果他们可以以任何方式避免它，继续使用 XP 可能不是明智之举.
Windows XP 面临生命周期终止；微软将在 2014 年 4 月（本月）为用户提供该操作系统的最终安全更新。我是否有责任鼓励继续使用漏洞不断增加的操作系统？
尽管与 IE8 一样，Windows XP 仍然是主要存在，但 Google 早已不再支持 IE8 与 Google 应用程序一起使用。一个例子。
我花了几个小时来试验这个问题，但仍然不清楚究竟是什么原因或解决方法。那是我为这个项目带来的利润严重受损。
切换到 Firefox、Chrome 或 Opera 并不难

【讨论】：