body {
background-color: red;
}Run Code Online (Sandbox Code Playgroud)
<body>
<div>Hello World!</div>
</body>Run Code Online (Sandbox Code Playgroud)
因此background-color: red;适用于整页高度,但是当我检查页面时,身体的高度仅限于div包含Hello World!.
有人请解释一下为什么会这样.
主要的原因是因为HTML取background-color的BODY,因为:
根元素的背景成为画布的背景并覆盖整个画布[...]
如此以来,默认background-color的HTML是transparent它会从一个BODY.但是,对于元素HTML和BODY元素应用颜色,您将看到BODY背景不再覆盖整个页面.
html {
background-color: blue;
}
body {
background-color: red;
}Run Code Online (Sandbox Code Playgroud)
<html>
<body>
<div>Hello World!</div>
</body>
</html>Run Code Online (Sandbox Code Playgroud)
根元素的背景成为画布的背景并覆盖整个画布,锚定(for
background-position)与仅为根元素本身绘制时相同的点.根元素不会再次绘制此背景.但是,对于HTML文档,我们建议作者指定
BODY元素的背景而不是HTML元素.对于其根元素是HTML"HTML"元素的文档或具有transparentforbackground-color和nonefor的计算值的XHTML"html"元素background-image,用户代理必须使用该元素的第一个HTML"BODY"元素的背景属性的计算值或在为画布绘制背景时,XHTML"body"元素子元素,并且不得为该子元素绘制背景.如果仅为根元素绘制它们,那么这些背景也必须固定在同一点上.
| 归档时间: |
|
| 查看次数: |
4245 次 |
| 最近记录: |