Sass 将相同样式应用于父级和嵌套子级

我有以下的css规则

* {
    box-sizing: border-box;
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none;
}

我还想将相同的样式规则应用于

*：：after

和

*：：before

，我可以通过

*，*：：after，*：：before{}

实现。但是，我希望与嵌套的其他SCS保持一致，因此我试图找出如何嵌套这些伪元素，同时对所有3个选择器应用相同的样式。

您可以这样使用：

* {
  &, &::after, &::before {
    box-sizing: border-box;
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none;
  }
}

它将汇编为：

*, *::after, *::before {
  box-sizing: border-box;
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
}

---

你能解释一下最后一部分吗？通过使用

，*：：after，*：：before{}

，您试图避免什么？你能举个例子吗？