CSS height
属性，百分比值和DOCTYPE
问题的 第一部分 询问如何对您的身高施加100％的高度
div，其他人多次回答。本质上，在根元素上声明高度：
html { height: 100%; }问题的 第二部分 受到的关注要少得多。我会尽力回答。
为什么去除
doctypemake（绿色背景）有效？
当您删除DOCTYPE文档类型声明时，浏览器将从标准模式 切换为 怪异模式 。
在怪癖模式（也称为兼容模式）下，浏览器模拟一个旧的浏览器，以便它可以解析旧的网页-
在Web标准问世之前创作的页面。处于古怪模式的浏览器伪装为IE4，IE5和Navigator4，因此它可以按照作者的预期呈现旧代码。
下面是维基百科定义
在计算中，“怪癖”模式是指某些Web浏览器为了保持与为较旧的浏览器设计的网页的向后兼容性而使用的技术，而不是在标准模式下严格遵守W3C和IETF标准。
这是MDN的举动：
在网络的早期，页面通常以两种版本编写：一种用于Netscape Navigator，另一种用于Microsoft Internet
Explorer。在W3C制定Web标准时，浏览器不能仅仅开始使用它们，因为这样做会破坏Web上大多数现有的网站。因此，浏览器引入了两种模式，以区别于旧的旧站点来处理符合新标准的站点。
现在，这是height: 100%
代码中的代码在怪癖模式下而不在标准模式下工作的特定原因：
在标准模式下，如果父元素的
height:auto高度（未定义高度），则子元素的百分比高度也将被视为
height:auto按照规范。
这就是为什么第一个问题的答案是
html { height: 100%; }。为了
height:100%在中工作
div，您必须
height在父元素上设置一个。
但是，在怪癖模式下，如果父元素具有a
height: auto，则将 相对于视口 测量子元素的高度百分比。
TL; DR
简而言之，这是开发人员需要了解的内容：
处于怪异模式的浏览器将以一种无法预测，不可靠且通常不受欢迎的方式呈现网页。因此，请 始终包括DOCTYPE
，以便文档以标准模式呈现。
选择正确的DOCTYPE过去是一个模棱两可且有些混乱的过程，许多DOCTYPE版本可供选择。但是今天的过程像以往一样简单。只需使用：
<!DOCTYPE html>
