css伪类和伪元素区别

css引入伪类和伪元素是为了格式化文档树以外的信息,也就是说,伪类和为元素是用来修饰不在文档树当中的部分,如一句话的第一个字母,列表中的第一个元素。
**伪类用于当已有元素处于某个状态的时候,我们为其添加对应的样式。**这个状态是根据用户行为而动态变化的。比如说:当用户鼠标停在莫格指定的元素时,我们可以通过hover来描述这个元素的状态,虽然它和普通的 CSS 类相似,可以为已有的元素添加样式,但是它只有处于 dom 树无法描述的状态下才能为元素添加样式,所以将其称为伪类。
**伪元素用于创建一些不在文档树中的元素,并为其添加样式。**比如说,我们可以通过:before 来在一个元素前添加一些文本,并为这些文本添加样式。虽然用户可以看到这些文本,但是这些文本实际上不在文档树中。
伪类的操作对象是文档树中已有的元素,而伪元素则创建了一个文档树外的元素。因此,伪类和伪元素的区别在于:有没有创建一个文档树之外的元素。
在这里插入图片描述
在这里插入图片描述

猜你喜欢

转载自blog.csdn.net/weixin_51610980/article/details/128553661