在 IE9 的内部 iframe 中忽略 EmulateIE8
Posted
技术标签:
【中文标题】在 IE9 的内部 iframe 中忽略 EmulateIE8【英文标题】：Ignore EmulateIE8 in inner iframe in IE9 【发布时间】：2013-07-11 12:49:21 【问题描述】：我正在尝试通过 iframe 在旧页面中嵌入“新”样式页面，但在 IE9 中，当页面加载到 iframe 中时，边框半径之类的内容仍然无效。当页面自己加载时，圆角和效果看起来还不错，但在 iframe 内时，css 属性似乎被忽略了。
最初我认为这是 DOCTYPE 继承问题，但它们都是<!DOCTYPE html>（外页和内页）。接下来，我相信内部 iframe 继承的是 content="IE=Emulate8"。这当然是一种理论。如果这是一个不正确的理论，请告诉我。 :)
不管怎样，下面是一个页面示例：
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta content="IE=EmulateIE8" http-equiv="X-UA-Compatible">
</head>
<body>
... stuff...
<iframe>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,initial-scale=1">
</head>
</html>
</iframe>
</body>
</html>
其中一些可能并不真正相关。无论如何，我的问题是：如果 EmulateIE8 是导致诸如border-radius 之类的 css 属性在 IE9 下的 iframe 中不起作用的罪魁祸首，是否可以在内部 iframe 中覆盖或禁用它？
请注意：不幸的是，如果不更改应用程序的整个框架，就很难更改 iframe 之外的内容（遗留应用程序 *sigh*）。我正在尝试在遗留应用程序中添加一些更现代的东西。
【问题讨论】：
【参考方案1】：如 here 所述： 从 IE9 模式开始，网页无法显示多种文档模式。例如，考虑一个基于标准的网页，该网页包含一个以 quirks 模式显示内容的框架元素。 IE9 模式以标准模式显示子框架（因为父文档处于标准模式）。但是，从 Internet Explorer 10 开始，子框架可以模拟 quirks 模式。有关详细信息，请参阅 IEBlog：IE10 中的 HTML5 Quirks 模式。但是，为了获得最佳效果，请始终使用文档模式。
【讨论】：
以上是关于在 IE9 的内部 iframe 中忽略 EmulateIE8的主要内容，如果未能解决你的问题，请参考以下文章
IE9 - 主页中的怪癖模式和特定 iframe 中的“Internet Explorer 9 标准”