Open Lawguancong opened 3 years ago
一般':' MDN上面阐述的很明确，伪类就是一个选择处于特定状态的元素的选择器，比如某一个clsss的第一个元素，某个被hover的元素等等...，我们可以理解成一个特定的CSS类，但与普通的类不一样，它只有处于DOM树无法描述的状态下才能为元素添加样式，所以将其称为伪类
一般"::" 伪元素和伪类很像，但是伪元素类似于增添一个新的DOM节点到DOM树中，而不是改变元素的状态。注意了，这里是类似，而不是真的增加一个节点，这也是其被称为伪元素的原因（实质上，元素被创建在文档外）。
伪类是操作文档中已有的元素（已存在），而伪元素是创建了一个文档外的元素（不存在），两者最关键的区别就是这点。此外，为了书写CSS时进行区分，一般伪类是单冒号，如:hover，而伪元素是双冒号::before。一般大部分伪类强制使用单冒号，大部分伪元素单冒号和双冒号都可以，但是为了区分，建议按照规范书写。 伪元素用于创建一些不在文档树中的元素，并为其添加样式。比如说，我们可以通过:before来在一个元素前增加一些文本，并为这些文本添加样式。虽然用户可以看到这些文本，但是这些文本实际上不在文档树中。
参考链接 https://juejin.cn/post/6844903929289900046
伪类
一般':' MDN上面阐述的很明确，伪类就是一个选择处于特定状态的元素的选择器，比如某一个clsss的第一个元素，某个被hover的元素等等...，我们可以理解成一个特定的CSS类，但与普通的类不一样，它只有处于DOM树无法描述的状态下才能为元素添加样式，所以将其称为伪类
伪元素
一般"::" 伪元素和伪类很像，但是伪元素类似于增添一个新的DOM节点到DOM树中，而不是改变元素的状态。注意了，这里是类似，而不是真的增加一个节点，这也是其被称为伪元素的原因（实质上，元素被创建在文档外）。
区别
伪类是操作文档中已有的元素（已存在），而伪元素是创建了一个文档外的元素（不存在），两者最关键的区别就是这点。此外，为了书写CSS时进行区分，一般伪类是单冒号，如:hover，而伪元素是双冒号::before。一般大部分伪类强制使用单冒号，大部分伪元素单冒号和双冒号都可以，但是为了区分，建议按照规范书写。 伪元素用于创建一些不在文档树中的元素，并为其添加样式。比如说，我们可以通过:before来在一个元素前增加一些文本，并为这些文本添加样式。虽然用户可以看到这些文本，但是这些文本实际上不在文档树中。
参考链接 https://juejin.cn/post/6844903929289900046