Question

html {
  box-sizing: border-box;
}

*,
*::before,
*::after {
  box-sizing: inherit;
}

body {
  margin: 0;
}`

我尝试分别删除其中的每一个，但没有区别。

Answer 1

html {
  box-sizing: border-box;
}

为您的根元素设置box-sizing至border-box

*,
*::before,
*::after {
  box-sizing: inherit;
}

在这里，所有子元素（包括伪元素）都设置为继承box-sizing值（从根元素开始）

body {
  margin: 0;
}

大多数（或全部？）浏览器的body元素都有默认的边距。如果您的代码是

<body>
    Some text
</body>

浏览器的边缘将有一些空间。为了“标准化”并从浏览器的边缘开始您的设计，边距设置为0。