Css POSTSS自动重置和POSTSS初始设置的目的是什么

目的是什么：

这两方面的文档都非常稀少，并且没有真正解释为什么要使用它们以及它们的用途

我试过自动重置。它似乎将

all:initial

放在您设计的每个元素上。在查看输出时，这似乎非常浪费

它与：

* {
    all: initial,
    font-family: "Roboto"
}

查看autoreset的代码，它似乎就是这样做的：

---

我不明白为什么这比使用

*

更好。当您想要创建可隔离组件时，这比

*

更好，这意味着您可以像插件或附加组件一样集成到其他人的应用程序或网站中。

postsss autoreset

保护您免受CSS中继承属性的影响

假设您编写了一个组件并将其发布到npm。您使用了BEM或CSS模块，因此选择器是隔离的。但一些开发人员将您的组件带到网页上时使用了：

* {
  box-sizing: border-box;
  line-height: 2
}

由于非默认的

框大小调整

您的所有尺寸都会被破坏。因为操作系统的非标准

行高

文本变得更大，破坏了设计

下面是组件中此类问题的一个真实示例

---

postsss autoreset

将把

all:initial

放在组件CSS中的每个选择器上：

.component {
  all: initial; /* added by postcss-autoreset, you didn’t write it */
  width: 100px;
  padding: 10px;
}
.component_title {
  all: initial; /* added by postcss-autoreset, you didn’t write it */
  height: 20px;
}

---

因此，在您的组件中自动插入

all:initial

禁用用户

框大小调整

和

行高

，并且您的组件在用户网站中的外观相同。

但是如果我使用bootstrap，autoreset也会擦除bootstrap的样式吗？这是否意味着，autoreset对于孤立的组件是有用的，但是对于通常的站点开发人员来说没有理由使用它？