奇怪的使用CSS :: before，:: after

Question

在Sitepoint example（来自this article）中看到了这一点CSS，并且无法理解它应该做什么。显然，第一个选择器会将box-sizing样式应用于所有内容，但在这种情况下，我不了解::before / ::after的用法。我知道那些用于在给定元素之前或之后添加内容，但它在这里用于什么目的？

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

Answer 1

这会强制任何::before或::after元素也使用box-sizing属性，因为您可以将它们塑造成盒子一样。 *不包含这些伪元素，因此*::pseudo会为您执行此操作。

Answer 2

那是旧的实现：

  

双冒号取代了单冒号选择器   CSS3中的伪元素可以明确区分   伪类和伪元素。为了向后兼容，   对于预CSS3选择器，单冒号语法是可接受的。所以，：之后   是一个伪类，:: after是一个伪元素

：用于：before和：after伪元素与内容一起：允许你在指定的每个选择器之前/之后放置一些例如图像或图标等

所以，在这里，你选择所有内容并在它之前和之后应用box-sizing属性和样式，因为*不包括psuedo-elements

Answer 3

选择器意味着：

适用于所有元素，适用于每个元素之前的内容，并应用于每个元素之后的内容。