为什么iframe高度100％在XHTML页面中不起作用？

我玩弄嵌入第二页的iframe，并在iframe上方显示一个短头。为什么iframe高度100％在XHTML页面中不起作用？

在一个测试设置，height="100%"工作正常，而在另一个设置它没有再I noticed that差异在iframe的高度总是被设置为大约150像素的的一个文档是一个XHTML文档和文件的地方作品没有设置DOCTYPE。

所以，这个工作：（高度完全缩放到窗口）

<html> 
<head> </head> 
<body> 
<h1>Wrapper Header ...</h1> 
<hr/> 
<iframe src="/jenkins" width="100%" height="100%"> 
    <p>iframes not suppoerted</p> 
</iframe> 
</body> 
</html>

这不（高度约150像素左右）

<!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" width="100%" height="100%"> 
    <p>iframes not suppoerted</p> 
</iframe> 
</body> 
</html>

显示在IE8相同和FF5。

为什么是否它的高度百分比不再有效，如果我有XHTML文档类型？

来源

2011-07-15 Martin Ba

因为页面在标准模式下使用有效的DTD呈现。它在其他模式下工作的原因是因为它处于怪癖模式。

它在怪癖模式下工作的原因是因为浏览器在过去非常宽松并且不严格，因此人们在过去没有在html/body上指定高度的情况下做了height="100%"。

现在正确的做法是在html/body上设置高度。尝试类似html, body { height:100%; }

iframe可能也需要是直接的孩子才能发生这种情况。或者，你可以定位它绝对/固定。

来源

2011-07-15 14:23:57

感谢您提及的HTML /身高的事情。 –

但是，您是否需要设置包含“iframe”的页面的html/body高度或在其中加载的页面？ –

身高100％无法正常工作，但在iframe上使用绝对位置对我有效。谢谢！ –

为什么iframe高度100％在XHTML页面中不起作用？

回答

相关问题