全部：初始与使用 CSS 重置

Question

我知道有很多所谓的“css重置”，例如

但我不明白的是为什么似乎无法使用更简单的方法。

据我所知，initial 关键字将属性重置为 CSS 规范中定义为属性默认值的值.

现在我们有了类似 all 属性的关键字，我希望我可以使用类似

的东西

* {
  all: initial;
}

or

:root {
  all: initial;
}

而不是所有这些 reset.css 和 normalize.css。也就是说，我希望这些简短的片段之一能帮助我从用户代理样式表中删除添加到网页的样式。

但它并没有像我预期的那样真正起作用。好像

:root, html, body {
  all: initial
}

根本没有真正从用户代理样式表中删除“继承”的样式，并且

* {
  all: initial
}

删除样式过于激进。例如，它使我的 style 和 script 元素可见！我不认为 CSS 规范说这两个元素应该是可见的。我确信 CSS 规范说它们应该不可见。也就是好像

* {
  all: initial
}

不是将我的样式重置为 CSS 规范级别，而是将它们重置为绝对零级别。这不是我想要的。

有人能解释一下我的理解有什么问题吗？

Answer 1

你是正确的initial resets to initial values for a given CSS property, but note that CSS properties have no initial value for each element-- they only have an initial value for that property, which will be the same for any and all elements it is applied to. For instance, the color property spec has a single initial value defined-- not a list of initial values to which it should be set for every element. So when you use it in conjunction with all，使用：

* {
  all: initial
}

...您告诉浏览器获取每个元素的每个属性并将其重置为 属性的 默认值。因此，例如，display property spec 将其初始值定义为 inline-- 因此 页面上的每个元素 都将显示为 inline。

全部：初始与使用 CSS 重置

all: initial vs. using CSS resets

css

reset