伪类和伪元素的区别

概念：

伪类是添加到选择器的关键字，指定要选择的元素的特殊状态。
伪元素添加到选择器，但不是描述特殊状态，它们允许您为元素的某些部分设置样式。

所有伪类：

常见伪类
:active 
:focus
:hover 
:link
:visited
:first-child
:lang

---

不常见伪类
:any
:checked
:default
:dir()
:disabled
:empty
:enabled
:first
:first-child
:first-of-type
:fullscreen
:indeterminate
:in-range
:invalid
:last-child
:last-of-type
:left    
:not()
:nth-child()
:nth-last-child()
:nth-last-of-type()
:nth-of-type()
:only-child
:only-of-type
:optional
:out-of-range
:read-only
:read-write
:required
:right
:root
:scope
:target
:valid

所有伪元素：

::after
::before
::first-letter
::first-line
::selection

注意事项

你会发现伪元素使用了两个冒号 (::) 而不是一个冒号 (:)。这是CSS3的一部分，并尝试区分伪类和伪元素。大多数浏览器都支持这两个值。
伪类参考
伪元素参考