：Afs.与::after

Question

在CSS2.1 :after和CSS3 ::after伪选择器之间有什么功能上的区别(除了在老浏览器中不支持的::after )吗？使用新的规范有什么实际的理由吗？

Answer 1

这是伪类与pseudo-element的区别。

除了::first-line，::first-letter，::before和::after (它们已经出现了一段时间，如果你需要IE8支持，可以使用单冒号)，pseudo-elements需要双冒号。

选择实际的元素本身，你可以使用:first-child或:nth-of-type(n)来选择<p>中的第一个或特定的元素，例如。

(以及:hover和:focus等实际元素的状态。)

Pseudo-elements的目标是像::first-line或::first-letter这样的元素的子部分，这些元素本身并不是元素。

实际上，更好的描述是：http://bricss.net/post/10768584657/know-your-lingo-pseudo-class-vs-pseudo-element

同样在这里：http://www.evotech.net/blog/2007/05/after-v-after-what-is-double-colon-notation/

Answer 2

像::after这样的CSS选择器是一些在DOM树中不能作为显式元素使用的虚拟元素。它们被称为"“，用于在元素之前/之后插入某些内容(例如：::before，::after) 或选择元素的某些部分(例如：::first-letter)。目前只有5个标准的伪元素：after, before, first-letter, first-line, selection。

另一方面，还有其他类型的选择器，称为"“，用于定义元素的特殊状态(如:hover，:focus，:nth-child(n))。这些操作将选择DOM中的整个现有元素。伪类是一个超过30个项目的长列表。

最初(在CSS2和CSS1中)，伪类和伪元素都使用单冒号语法。但是，在CSS3中，::语法替换了伪元素的:表示法，以便更好地区分它们。

为了向后兼容，旧的单冒号语法对于像:after这样的伪元素是可以接受的(浏览器仍然都支持带有一个分号的旧语法)。只有IE-8不支持新语法(如果您想支持IE8，请使用单冒号)。