选择器的权重(优先级)

47 篇文章 0 订阅
42 篇文章 0 订阅

样式的冲突

当我们通过不同的选择器,选中相同的元素,并且为相同的样式设置不同的值时,此时就发生了样式的冲突


选择器的权重(优先级)

!important						最高优先级(慎用)
内联样式							1,0,0,0
id选择器					    0,1,0,0
类和伪类选择器					0,0,1,0
元素选择器						0,0,0,1
通配选择器						0,0,0,0
继承的样式						没有优先级(最低)

注:

a)比较优先级时,需要将所有的选择器的优先级进行相加计算,最后优先级越高,则越优先显示(分组选择器是单独计算的) (叠加原则)

b)选择器的累加不会超过其最大的数量级(例如类选择器再高也不会超过id选择器)

c)如果优先级计算后相同,此时则优先使用靠下的样式(就近原则)

d)在某一个样式的后边添加 !important,则此时该样式会获取到最高的优先级,甚至超过内联样式(开发时慎用)


CSS选择器遵循

a)在相同级别:1、叠加原则 2、就近原则

b)id选择器> 类选择器 > 标签选择器

c)范围越小,优先级别越高

  • 2
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值