为啥 iframe 高度 100% 在 XHTML 页面中不起作用? [复制]
Posted
技术标签:
【中文标题】为啥 iframe 高度 100% 在 XHTML 页面中不起作用? [复制]【英文标题】:Why does iframe height 100% not work in an XHTML page? [duplicate]为什么 iframe 高度 100% 在 XHTML 页面中不起作用? [复制] 【发布时间】:2011-10-06 05:05:59 【问题描述】:我正在玩一个嵌入第二页的 iframe,并且只在 iframe 上方显示一个短标题。
在一个测试设置中,height="100%"
工作正常,而在另一个设置中却没有,然后I noticed that 不同之处在于 iframe 高度始终设置为大约 150 像素的一个文档是 Xhtml 文档,而它工作的文档没有设置 DOCTYPE。
所以,这行得通:(高度完全缩放到窗口)
<html>
<head> </head>
<body>
<h1>Wrapper Header ...</h1>
<hr/>
<iframe src="/jenkins" >
<p>iframes not suppoerted</p>
</iframe>
</body>
</html>
而这个没有(高度约150px左右)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head> </head>
<body>
<h1>Wrapper Header ...</h1>
<hr/>
<iframe src="/jenkins" >
<p>iframes not suppoerted</p>
</iframe>
</body>
</html>
IE8和FF5的显示是一样的
为什么如果我有 XHTML doctype,高度百分比不再起作用?
【问题讨论】:
【参考方案1】:因为页面以标准模式呈现并具有有效的 DTD。它在其他模式下工作的原因是因为它处于怪癖模式。
之所以在怪异模式下工作,是因为过去浏览器非常宽松,不严格,因此过去人们在 html/body 上没有指定高度就这样做了height="100%"
。
现在正确的做法是在 html/body 上设置高度。试试html, body height:100%;
iframe 可能还需要是直接子级才能发生这种情况。或者,您可以绝对/固定地定位它。
【讨论】:
感谢您提及 html/body 高度问题。 但是您是否需要设置包含iframe
的页面或其中加载的页面的html/body 高度?
Height 100% 不起作用,但在 iframe 上使用绝对位置对我来说是有效的。谢谢!以上是关于为啥 iframe 高度 100% 在 XHTML 页面中不起作用? [复制]的主要内容,如果未能解决你的问题,请参考以下文章
Internet Explorer 7 iframe,使高度 100%