使用响应式设计的图像不显示在 IE 中
Images not showing up in IE using responsive design
所以我有一个网站（参见 this page - 它已经上线，但在即将推出的封面后面），伴随着两种风格 sheet：一种用于普通风格（style.css) 和一种仅适用于特定样式的样式 (width.css - 或者换句话说：响应式设计)。 sheet 可确保某些照片不会在较小的屏幕尺寸下显示，但会在较大的屏幕上显示。
至少 - 这是它必须做的，它在 Chrome 和 Firefox 中运行良好，但在 IE（版本 11）中却不行。 IE 的开发工具显示我的图像的计算属性是 display:none 和 display:inital（我在大多数情况下使用）被划掉，尽管 display:inital 在最小宽度中： 700px / min-width:900px 部分。
有没有人可以帮助我？如果您需要更多资源/代码，我很乐意提供。
提前致谢！
简单地说它没有显示，因为它读取的关于该图像的最新规则是 display:none，width.css 上的第 42 行。 Chrome 和 FF 显示它的原因是因为它还有一个 ID，该 ID 比具有规则 display:initial.
的 class 具有更高的特异性
我不知道为什么 IE 认为 .overviewphoto 比 #opgroot 更重要，但看起来可能只需要其中一个？
编辑：如 Desperados_ 所述，IE 不支持 initial（我确实认为这是一个奇怪的），因此 IE 无法使用它，而是呈现 none。
快速修复将在 ie.css 中添加这个：img#opgroot { display:initial!important; } 但我不建议这样做。
保持代码尽可能简单肯定有助于解决这些跨浏览器错误。
将“initial" value is not supported by IE. However you can use "visibility”属性代替display: initial;或其他值进行显示属性。
所以我有一个网站（参见 this page - 它已经上线，但在即将推出的封面后面），伴随着两种风格 sheet：一种用于普通风格（style.css) 和一种仅适用于特定样式的样式 (width.css - 或者换句话说：响应式设计)。 sheet 可确保某些照片不会在较小的屏幕尺寸下显示，但会在较大的屏幕上显示。
至少 - 这是它必须做的，它在 Chrome 和 Firefox 中运行良好，但在 IE（版本 11）中却不行。 IE 的开发工具显示我的图像的计算属性是 display:none 和 display:inital（我在大多数情况下使用）被划掉，尽管 display:inital 在最小宽度中： 700px / min-width:900px 部分。
有没有人可以帮助我？如果您需要更多资源/代码，我很乐意提供。
提前致谢！
简单地说它没有显示，因为它读取的关于该图像的最新规则是 display:none，width.css 上的第 42 行。 Chrome 和 FF 显示它的原因是因为它还有一个 ID，该 ID 比具有规则 display:initial.
我不知道为什么 IE 认为 .overviewphoto 比 #opgroot 更重要，但看起来可能只需要其中一个？
编辑：如 Desperados_ 所述，IE 不支持 initial（我确实认为这是一个奇怪的），因此 IE 无法使用它，而是呈现 none。
快速修复将在 ie.css 中添加这个：img#opgroot { display:initial!important; } 但我不建议这样做。
保持代码尽可能简单肯定有助于解决这些跨浏览器错误。
将“initial" value is not supported by IE. However you can use "visibility”属性代替display: initial;或其他值进行显示属性。