CSS中为何用(*, *::before, *::after)而非(*, ::before, ::after)设置box-sizing？

首先明确：你用的*, ::before, ::after写法本身没有语法错误，也能正常给所有伪元素应用样式，但主流写法会在伪元素前加*，主要是为了避开几个潜在的坑：

• 优先级差异：不带*的::before/::after优先级比*::before/*::after更低。如果页面里有其他针对特定元素伪元素的样式（比如.card::before），单独的::before会更容易被覆盖；而*::before和这类特定元素伪元素选择器的优先级一致（都是通用选择器+伪元素），不会出现意外被覆盖的情况。
• 历史兼容性：早期旧浏览器（比如IE8及更早版本）对独立的::before/::after支持不佳，必须绑定具体元素选择器才能生效，加*是当时为了兼容这些环境的写法，虽然现在主流浏览器都支持独立伪元素选择器，但这个稳妥的写法被保留了下来。
• 语义直观性：*::before明确表示“所有元素的before伪元素”，语义更清晰；单独的::before虽然效果相同，但对新手来说可能会疑惑它的作用范围，可读性稍差。

总结：如果你的项目不需要兼容旧浏览器，且能完全把控样式优先级，用*, ::before, ::after完全没问题。但主流写法加*是为了避免上述潜在问题，属于更稳妥的通用方案。

内容的提问来源于stack exchange，提问作者Ngonidzashe Zvenyika