css - 似乎无法在 IE8 中正确显示 iframe？

Question

我在这里有一个网站:Campus Tour我也试图在 iframe 中显示。此处的目标是能够准确地看到学生在移动设备上查看导览时所看到的内容。

这是 iPhone 视口(viewport):iPhone Viewport

它在 Chrome 中可以正常显示，但我无法在 IE8 中显示它。在 IE8 中查看时，iframe 以完整站点模式显示站点，并且不遵循移动 CSS。

这是我的 iframe 代码:

<div align="center" style="position: fixed; margin-top: 2%; margin-left: 12%; border: 5px solid #f60; width: auto; height: auto;">

                <h2 style="font-weight:bold; background-color: #f60; color: #fff;">iPhone 5 Display</h2>
                    <iframe style="width:568px; height: 320px; " src="http://webfro.gs/south/tour" frameborder="0"></iframe>
            </div>

我用谷歌搜索并阅读了有关 Quirks 模式等的信息，但不太确定如何应用它。我也不确定这是否是正确的解决方案。

为了在这里提供帮助，您还需要什么信息？

Answer 1

您的问题是 IE8 不支持 CSS 媒体查询，您使用它根据视口(viewport)的大小更改布局。

如果你需要为此支持 IE8，最好的解决方案是使用类似 Respond.js 的 polyfill 脚本，它将对媒体查询语法的支持反向移植到 IE8 中。