CSS 伪类和伪元素的区别是什么？

伪类

伪类都使用了一个冒号（:）

伪类用于当已有元素处于某种状态时，为其添加对应的样式，这个状态是根据用户行为变化而变化的。比如说:hover。它只有处于dom 树无法描述的状态才能为元素添加样式，所以称为伪类。

伪元素

伪元素 都使用了两个冒号（: :）

伪元素用于创建一些原本不在文档树中的元素，并为其添加样式，比如说::before。虽然用户可以看到这些内容，但是其实他不在文档树中。

伪类和伪元素的区别

伪类作用的对象是整个对象。

伪类没有创造元素，例如：first-child只是给子元素添加样式。

伪元素作用于元素的一部分，一个段落的第一行或第一个字母。

伪元素相当于创造了一个元素，例如：before和：after添加了一个新的元素，并添加了相应的效果。