伪类和伪元素的区别

个人的关注点可能主要集中在js方向上,但是本着css也不能丢掉的原则,所以上网查了些css方面的困惑点,这一篇的主题是:伪类和伪元素


伪类和伪元素的根本区别在于:它们是否创造了新的元素(抽象)。从我们模仿其意义的角度来看,如果需要添加新元素加以标识的,就是伪元素,反之,如果只需要在既有元素上添加类别的,就是伪类。


最为混淆的,可能是大部分人都将 :before 和 :after 这样的伪元素随口叫做伪类,而且即使在概念混淆的情况下,实际使用上也毫无问题——因为即使概念混淆,对真正使用也不会造成多少麻烦:) 
CSS Selector Level 3 为了区分这两者的混淆,而特意用冒号加以区分: 
伪类用一个冒号表示 :first-child 
伪元素则使用两个冒号表示 ::first-line 


目前为止,伪元素在一个选择器里只能出现一次,并且只能出现在末尾。实则,伪元素是选中了某个元素的符合逻辑的某个实际却不存在的部分,所以应用中也不会有人将其误写成多个。伪类则是像真正的类一样发挥着类的作用,没有数量上的限制,只要不是相互排斥的伪类,也可以同时使用在相同的元素上。


伪类的例子有:

:hover

:active

:first-child

:visited

等。

伪元素的例子有:

:first-line

:first-letter

:after

:before

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值