总结伪类和伪元素的区别

Posted 2020-09-19

最学习css的时候，伪类和伪元素很容易混淆。当时看了很多区别文章还是迷糊。只有自己总结的东西才是自己的，我把我的方法介绍给你吧，对你可能有用。

先看看w3c对伪类和伪元素的定义及种类：

伪类　[用于向某些选择器添加特殊的效果]

---

伪元素　[用于将特殊的效果添加到某些选择器]

---

1、伪类 向选择器添加特殊效果，我们可以把选择器当成一个目标选择器，就相当于给一个选择器添加多种特殊效果。伪类即［一对多］

伪元素 将特殊效果添加到选择器，伪元素里面的效果是多样的，选择器还是一个。伪元素即［多对一］

无论是一对多还是多对一，都针对的是一个选择器，只是前后顺序差异。

2、伪类需要给元素添加class或者id，或者一些标签，如span。改变了文档结构。而伪元素则不用。