首先，html元素和body元素都是块级元素。

简述：有时候我们会发现html和body元素的高度是当前窗口的高度，而没有设置：的高度，这好像是设置了：的高度。

请看下面两个例子：

例1:

超文本标记语言

头

标题演示/标题

styletype='text/css '

*{

margin:0

padding:0

}。容器{

高度：30%；

}

/style

/head

身体

divclass='container'/div

/body

/html

此时容器的高度是窗口高度的30%，html和body元素的高度都是窗口高度。

例2:

！DOCTYPEhtml

超文本标记语言

头

标题演示/标题

styletype='text/css '

*{

margin:0

padding:0

}。容器{

高度：30%；

}

/style

/head

身体

divclass='container'/div

/body

/html

此时容器的高度为0，设置的高度：30%无效，html和body元素的高度都为0。

原因：例1中没有设置当前文档类型，默认启用兼容模式。兼容模式下html和body元素的高度是窗口的高度，但是是在例2中设置的！DOCTYPEhtml启用标准模式，标准模式下html和body元素的高度为0。

本文转载自中文网站