伪类和伪元素区别

伪类和伪元素的区别,其实很简单,从字面上就可以理解。它们有一个共同的修饰词“伪”,那么“伪”是什么意思呢?就是假的呗。所以,伪类就是假的类,伪元素就是假的元素,这就是在字面上它们之间的区别。下面我们再从定义上感受一下。

1.伪类

css2中给的定义  css伪类用于某些选择器添加特殊的效果

css3中给的定义:伪类存在的意义是为了通过选择器,格式化DOM树以外的信息以及不能被常规CSS选择器获取到的信息。

伪类的功能有两种:

  1. 获取不存在与DOM树中的信息。比如<a>标签的:linkvisited等,这些信息不存在与DOM树结构中,只能通过CSS选择器来获取;
  2. 获取不能被常规CSS选择器获取的信息。比如伪类:target,它的作用是匹配文档(页面)的URI中某个标志符的目标元素,

2.伪元素

css2指出 伪元素用于某些选择器设置特殊效果

伪元素可以创建一些文档语言无法创建的虚拟元素。比如:文档语言没有一种机制可以描述元素内容的第一个字母或第一行,但伪元素可以做到(::first-letter、::first-line)。同时,伪元素还可以创建源文档不存在的内容,比如使用 ::before 或 ::after

总结一下伪类与伪元素的特性及其区别:

  1. 伪类本质上是为了弥补常规CSS选择器的不足,以便获取到更多信息;
  2. 伪元素本质上是创建了一个有内容的虚拟容器;
  3. CSS3中伪类和伪元素的语法不同;伪类用单冒号:表示;而伪元素用双冒号::表示。一个选择器可以同时使用多个伪类(但有的伪类会互斥);而一个选择器只能同时使用一个伪元素(未来的版本可能会支持多伪元素)。
  4. 可以同时使用多个伪类,而只能同时使用一个伪元素;
  • 0
    点赞
  • 8
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值