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

发布时间：2020-12-14 18:48:36 所属栏目：资源来源：网络整理

导读：参见英文答案 Full-screen iframe with a height of 100%15个我正在玩一个嵌入第二页的iframe,只是在iframe上面显示一个短标题. 在一个测试设置中,height =“100％”正常工作,在另一个设置中没有,然后I noticed that差异是iframe高度始终设置为约150px的一

参见英文答案 > Full-screen iframe with a height of 100%15个
我正在玩一个嵌入第二页的iframe,只是在iframe上面显示一个短标题.

在一个测试设置中,height =“100％”正常工作,在另一个设置中没有,然后I noticed that差异是iframe高度始终设置为约150px的一个文档是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>

这不(高约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" width="100%" height="100%">
  <p>iframes not suppoerted</p>
</iframe>
</body>
</html>

IE8和FF5中的显示相同.

如果我有XHTML doctype,为什么高度百分比不再有效？

解决方法

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

它在怪癖模式下工作的原因是因为浏览器在过去非常宽松且不严格,因此人们在没有指定html / body的高度的情况下确实高度=“100％”.

现在正确的方法是在html / body上设置高度.尝试像html,body {height：100％; }

iframe可能也需要是直接的孩子才能实现.或者你可以绝对/固定它.

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!