css - CSS星号是一个好习惯吗

Question

我正在重新设计 Angular 应用程序的样式，并且有一个 CSS 规则:

 * {
   font-family: Roboto, Arial, Helvetica, sans-serif;
   }

我知道这基本上是将该字体应用于 DOM 中的每个元素。我很好奇这是否是一个好的做法，即使这是我们将使用的唯一字体。我打算将字体移动到一个全局 SASS 变量中，想知道我是否需要为字体操心。

Answer 1

由于样式的级联特性，使用 body { font-family: Roboto, Arial, Helvetica, sans-serif 就足够了； }，以便每个子元素都继承字体系列。这不会在选择器中创建定义的新实例。

如果您使用通用选择器 * { font-family: Roboto, Arial, Helvetica, sans-serif; } 它为每个元素创建一个新的选择器。

在使用通用选择器时，尝试浏览器中的差异并使用检查器检查每个元素。

您绝对应该选择继承。通用选择器会不必要地“污染”您的元素。

通用选择器的一个常见用例是为每个元素和伪元素分配一个替代框模型:

*,
*::before,
*::after {
  box-sizing: border-box; // 1
}