html - Chrome 中的 body 背景不考虑 body 的位置

Question

当您使用 position: relative; 在 Chrome(测试 v23)中的特定页面上移动 body 元素时； top: 100px; 例如，背景仍然应用于整个视口(viewport)。

这是 Chrome 错误还是任何人都可以解释行为/提供灵活的解决方案？

Answer 1

这实际上是所有浏览器的预期行为:虽然 body 元素确实从顶部偏移了 100 像素，但背景本身正在无缝传播到视口(viewport)，如第一部分所述this answer .这可能是 HTML 表示属性时代的遗留问题，在 body 上设置背景属性允许将背景传播到视口(viewport)，给人一种将背景应用于整个页面的外观。

如果你只想将背景限制在 body 元素上，只需给 html 一个不同于 transparent 的背景颜色，或者给它一个背景图片。然后视口(viewport)将使用 html 的背景。