使用<!DOCTYPE>时，“Height = 100％”在html中不起作用？

当我使用HTML而没有DOCTYPE时，我的HTML页面Height=100%正在工作。使用<!DOCTYPE>时，“Height = 100％”在html中不起作用？

但是当我使用DOCTYPE，高度不能正常工作......

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" lang="en"> 
<head> 

<meta http-equiv="Content-Type" content="text/html; charset=windows-1252"> 
<title>New Page 1</title> 
</head> 

<body> 

<table cellpadding="0" cellspacing="0" width="11" height ="100%"> 
    <tr> 
     <td height="100%" bgcolor="#008000">&nbsp;</td> 
    </tr> 
</table> 

</body>

如何解决这个问题呢？

来源

2009-12-27 Alex

这里的DOCTYPE问题的一个简单而明确的解释： http://stackoverflow.com/a/32215263/3597276 – 2015-08-25 23:09:20

当你说'身高= 100％'时，你必须考虑“100％是什么？”。它是该表格元素的父体，它是主体。但身体有多高？

做你想做什么，在CSS补充一点： HTML，身体{身高：100％}

来源

2009-12-27 16:34:16 Rob

从quirks mode添加DOCTYPE您切换到标准模式。在标准模式下，html和body元素不会默认为视口（浏览器窗口）大小的100％;相反，他们只是需要遏制自己的孩子。 100％的高度意味着100％的包含元素，但这只是包含表格内容所需的大小。怪异模式是模拟旧版浏览器的行为，其中html和body元素填充了视口。

为了解决这个问题，你只需要添加到您的文档：

<style> 
    html, body { height: 100% } 
</style>

来源

2009-12-27 16:51:17

我试着像上面，但宽度（100％）是工作，但高度不工作 – Alex 2009-12-28 09:01:30

您可以编辑你的帖子中包含你正在尝试的确切代码，以及哪个浏览器失败？ – 2009-12-28 12:56:47

我在Firefox中测试过，结果是好的。谢谢@布里斯坎贝尔 – 2013-05-12 09:28:35

就像大家说的解决方案的主要组成部分是把

html, body{'height=100%'}

但它也将每一个祖先的身高设定为100％非常重要。例如，如果你的代码如下

<body> 
    <div id="firstdiv"> 
     <div id="scnddiv"> 
       lets say this is the div you want to make 100% 
     </div> 
    </div> 
</body>

如果#scnddiv是你想100％的股利，不仅你必须做出html和身体100％，但也#firstdiv。所以它会看起来像这样

html, body, #firstdiv {height:100%}

然后你可以使该div中的任何东西都是100％。

我希望这会有所帮助。

来源

2017-06-16 03:40:25 user4504661

不知道为什么这是downvoted？ – Brian 2018-01-11 14:15:23

使用<!DOCTYPE>时，“Height = 100％”在html中不起作用？

回答

相关问题