用最通俗易懂，最简洁的语言说一下伪类和伪元素！

Question

伪类和伪元素，很多文章都写的很拗口，看了一头雾水。

用最最通俗易懂，最简洁的语言说一下伪类和伪元素！举个例子。

不要长篇大论，也不要拷贝，通俗易懂，用大白话！

Answer 1

我的理解：
css的引用，目的是为了将网页内容和语义（html）和它的表现形式（style）相分离，而如果我们要表示，文档开头第一个字如何如何，而文档结构本身又没有区分第一个字和后面的字。
这就出现了矛盾，到底是去修改文档，满足样式的定义，还是直接在样式里面就能处理，不要设计文档，按理说是后者，但是没有伪元素只能用前者。
于是伪元素就出现了，解决的就是这个问题。
而伪类，就是进一步，把一批伪元素再统一定义。

具体看
https://www.jianshu.com/p/996d021bced3

Answer 2

伪元素是一种虚拟的DOM元素，比如:before。伪类是一种属性，比如fist-child。

够通俗了吧？

Answer 3

伪元素使用 2 个冒号，常见的有：::before，::after，::first-line，::first-letter，::selection、::placeholder 等；
伪类使用1个冒号，常见的有：:hover，:link，:active，:target，:not()，:focus等。
伪元素添加了一个页面中没有的元素（只是从视觉效果上添加了，不是在文档树中添加）；
伪类是给页面中已经存在的元素添加一个类。