html - 覆盖 元素样式

Question

我正在玩一些基本的 html 和 css，但我对一件事感到困惑:根据许多资源，html 元素是根元素，但我可以像更改任何其他元素一样更改其样式值。根据这个https://www.w3schools.com/cssref/css_units.asp % 相对长度是相对于父元素的，但是当我将 html 的 width 属性设置为 50% 时，它似乎不起作用，因为整个背景仍然是蓝色，然后它起作用了，因为设置为 100% 宽度时子体只需要 50 % 的屏幕，然后我意识到它同时工作和不工作，我错过了什么？

html {
    background: blue;
    width: 50%;
    height: 100%;
    overflow: hidden;
}
body {
    background: yellow;
    width: 100%;
    height: 100%;
}

Answer 1

参见 the specification :

The background of the root element becomes the background of the canvas and covers the entire canvas

因此，即使 html 元素不是 Canvas 的整个宽度，整个 Canvas 也会采用该背景色。