HTML并不简单读书笔记-3

第二章
正确认识body元素和html元素
新建一个空白页，不设置任何css，我们用js获取body的高度。返回的结果是0.
但是如果设置一个背景颜色

body {
background:#000
}

设置后，背景颜色都为黑色

这里很奇怪，明明没有高度，黑色却铺满了整个浏览器。然后在body里设置任意的背景。

这里有两个问题，body的黑色背景没有了，html里渐变背景是8px平铺。

1.如果html未设置背景，body元素的背景会安装html的背景规则渲染，否则安装类似div等元素背景规则渲染。
2.html元素背景的高度至少为一屏。
3.body元素有margin:8px的默认样式，在css中有margin合并的规则，如果块级元素没有任何内容，同时没有padding或者border，那么margin上下会合并较大的值。
因此，默认状态下，html元素的高度是8px，所以渐变背景的高度就是8px。
如果html设置一个固定的高度，那么波形纹的高度就是100px。

失效的overflow:hidden
overflow也有类似的现象

很明显。body的overflow失效了，试一下给html设置

很明显，这个div的颜色整个就不显示了。

如果都设置上，这样overflow就会生效 。
这个原理跟之前一样，html的高度是一屏，就算给html元素设置overflow，body的overflow也会生效。
如果给div足够的高度，那他会隐藏超出一屏的高度的部分

也就是：虽然body和html为两个独立的元素，但实际上，他们有很多相同的渲染规则、