CSS-伪类和伪元素

伪类 是添加到选择器的关键字，指定要选择的元素的特殊状态。

伪元素 是一个附加至选择器末的关键词，对被选择元素的特定部分修改样式。

• 伪类就是一个选择处于特定状态的元素的选择器，比如某一个 clsss 的第一个元素，某个被 hover 的元素等等，我们可以理解成一个特定的CSS 类，但与普通的类不一样，它只有处于 DOM
  树无法描述的状态下才能为元素添加样式，所以将其称为伪类。
• 伪元素和伪类很像，但是伪元素类似于增添一个新的 DOM 节点到 DOM树中，而不是改变元素的状态。注意了，这里是类似，而不是真的增加一个节点，这也是其被称为伪元素的原因（实质上，元素被创建在文档外）。
• 伪类是操作文档中已有的元素，而伪元素是创建了一个文档外的元素，两者最关键的区别就是这点。此外，为了书写 CSS时进行区分，一般伪类是单冒号，如:hover，而伪元素是双冒号::before。

类似于普通的类，你可以在一个选择器中同时一起写多个伪类，但是一个选择器中只能使用一个伪元素，而且伪元素必须紧跟在语句中的简单选择器/基础选择器之后。
按照规范，伪元素应该使用双冒号（::）而不是单个冒号（:），以便区分伪类（:）和伪元素（::）。但是，由于旧版本的 W3C 规范并未对此进行特别区分，因此目前绝大多数的浏览器都同时支持使用这两种方式来表示伪元素。