为什么设置body元素的背景样式会影响整个屏幕？

Question

在为body元素的背景设置样式时，为什么样式会影响整个屏幕，而不仅是body元素本身？假设我创建了以下规则：

body {width: 700px; border: 1px dotted red; background-color: blue;}

我发现边框显示出了我所期望的700px宽，但是背景色占据了整个浏览器视口。为什么？

Answer 1

引用

根元素的背景成为画布的背景，并覆盖整个画布，将其锚定（用于“背景位置”），与仅针对根元素本身进行绘制时的锚定点相同。根元素不会再次绘制此背景。

该body元素是根元素，因此，按照CSS规则的要求，该元素将失去其背景样式，并且背景样式将应用于包含的画布（浏览器中的网页区域），因此整个屏幕均为蓝色。其他属性与元素一起保留（例如border）。