html - body 100% 宽度的目的

Question

body 和 html 元素的 width: 100% 的可能用途是什么？

有时我会在实时网站以及 StackOverflow 答案中看到类似重置片段的内容:

html, body
{
  width:  100%; /* ? */
  height: 100%;
  margin: 0;
}

这个问题听起来很傻，但确实让我很困扰。我不喜欢在 HTML 文档的根元素中使用一些“黑魔法”的情况。这让我觉得我不了解我正在做的事情的基本轮廓。

Answer 1

添加此样式只是为了确保 html 和 body 占据屏幕的 100% 宽度。仅针对某些内容覆盖默认值的情况(例如，在另一个 CSS 文件中)。但我从未见过有其他默认设置的浏览器。

如果您设置另一个值，它将占用或多或少的 100%。

html, body {
  width: 125%;
}

In this case body will occupy 125% * 125% = 156.25% of screen width because of 125% body width relative to 125% html