html - 为什么在 iFrame 中加载的网页在 Internet Explorer 7 中没有应用 css

Question

我有一个网页，里面有很多 CSS。我使用 iframe 来加载它。它几乎在每个浏览器上都能完美运行，但在 IE 版本 7 上根本没有应用 CSS。当我在 IE7 下的单独选项卡中打开页面时，它可以工作，但是 iframe 甚至没有应用一行 CSS？

谁能给我一些从哪里开始搜索的提示？

任何帮助将不胜感激。

编辑：主网页具有以下文档类型：

!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"

我不确定这是否属实，但我读过严格的文档类型可能会导致旧浏览器上的 iframe 出现问题。这会破坏框架的css吗？

score 3 · Accepted Answer

3

尝试

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7"/>

我用这个解决了。

于 2012-12-06T13:11:42.530 回答

score 3 · Accepted Answer

CSS 信息不会级联到 iframe。您需要将 CSS 引用添加到放入 iframe 的页面上。将 CSS 放入页面的一些方法包括：

带有样式标签

<style type="text/css">
h1 {color:red;}
p {color:blue;}
</style>

使用 iframe，您将不得不一遍又一遍地复制它。（不建议）

<link rel="stylesheet" type="text/css" href="theme.css">

使用 iframe，您只需将链接部分复制到<head>页面区域

这不是 IE7 的事情。这适用于所有支持 CSS 的浏览器

score 2 · Accepted Answer

1）希望iframe标签正确关闭

<IFRAME SRC='gnagna.htm' STYLE='width:100%;'></IFRAME>

使用 css 或设置宽度

<iframe src="somepage.htm"  frameborder=0 scrolling="auto" width="800" height="600"> This browser can not use IFRAME. </iframe>

2）可以尝试使用这些

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

或者

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN" "http://www.w3.org/TR/REC-html40/strict.dtd">

3)

您可以通过在 head 部分添加它来强制 Ie7 兼容性

<head>
<meta http-equiv="X-UA-Compatible" content="IE=7" />
</head>

或者

更快的方法是将以下行添加到 .htaccess

Header set X-UA-Compatible IE=EmulateIE7

4)

或者您可以为 ie7/ie6 应用 css 样式技巧

.somediv
{
height:30px;
*height:30px; //hack for ie7 
_height:30px; //hack for ie6
}

希望能帮助到你