我对html中body标签的大小感到困惑.
我有一个严格的代码如下:
<body>
</body>
Run Code Online (Sandbox Code Playgroud)
body{
padding: 0px;
height: 100px;
background-color: #e5e5e5;
}
Run Code Online (Sandbox Code Playgroud)
为什么背景会覆盖所有页面?,我认为它应该只覆盖100px,
请为我解释一下,谢谢你的帮助!
Juk*_*ela 18
这确实是令人困惑,但它是在CSS 2.1规范规定,第14.2背景:如果计算值background-color是transparent与计算值background-image是none对html元素(如东西都默认情况下),浏览器必须改用的计算值body元素的背景属性,不得渲染背景body(即使其透明).也就是说,如果缺少自己的背景,body背景会神奇地转向html背景html- 这只会影响背景属性,而不会影响body元素的真实高度.
我没有看到这个奇怪规则的任何理由,它规定了一种"反向继承".但它在CSS 2.1中明确规定并由浏览器应用.
正如在其他答案中所解释的那样,您可以通过设置背景html(使body背景真正body仅应用于背景)或使用内部包装元素body并在其上设置高度来使您的内容具有特定高度的背景(因为特殊规则适用)到body只).
感谢Anne van Kesteren,当我在WHATWG邮件列表中询问时,他指出了CSS规范.(我以为我心里知道CSS 2.1,但实际上并没有..)