在学习如何使 body 范围占满整个页面时，搜索了解到一个方法，此方法设置 body 高度等于视窗高度：
html, body { height: 100%; }
但是这个方法使用时如果出现 body 里内容高度大于视窗高度的情况，body 将不能覆盖整个页面，所以使用以上方法需要一定基本条件。尝试后发现一种方法是设置隐藏超出 html 范围的元素，同时设置超出 body 范围的内容通过滚动显示：
html, body { margin: 0; padding: 0; height: 100%; } html { overflow: hidden; } body { overflow: auto; }
这样可以使 html, body 始终固定为视窗大小，body 内的内容高度若超出body高度，则通过滚动显示，但 body 始终固定覆盖整个视窗。这样做的好处是当需要为 body 添加非纯色背景时，背景相对视窗是始终固定的，而不会随着窗口的滚动而滚动。
同时在尝试过程中发现了对不同元素设置
background-color 属性时得到的结果不一样，如下：- 对 body 的子元素设置背景颜色
可以看出
.children 并没有继承 .parent 的背景色属性，背景色为透明。- 对 body 设置背景色
通过开发者工具可以看到，body 在布局中所占范围高度只占 html 元素的上 50%，颜色为 div 的背景色粉色，但是 html 下 50% 的范围依然显示为 body 的背景色蓝色。由此可以看出，
background-color 属性在 body 元素中的表现与在 body 子元素中的表现并不相同，在对 html 元素进行相同测试后发现对 html 设置 background-color 属性效果与 body 相同。关于这一现象的解释见W3C文档。