选择器优先级_常用的CSS选择器有哪些,优先级是怎样的?

遇到这种问题,就按照平时写的答,从全局、局部(标签、标签属性、伪元素、伪类等)入手。

这样记住:每一个标签都有默认的样式以及继承的样式。写一个标签,尝试如何给它设置样式,你用过,总能够想出来好几个:

  1. id (#box):唯一的
  2. class(.box):选择所有class属性的属性值为 box的元素
  3. 标签 (div,p):选择所有的div和p元素
  4. 所有指定的后代(div p):选择div元素内的所有的p元素
  5. 相邻(div+p): 选择所有紧接在div元素后的p元素
  6. 兄弟(div~p): 选择所有跟div同级的p元素
  7. 通配符 * :选择所有的元素
  8. 属性选择(a[target=_blank]):选择所有a标签的target属性为_blank的a标签
  9. 伪元素选择器(::before、::after):创建DOM树结构中不存在的元素,并为其增加样式
  10. 伪类选择器(a:hover、a:active):用于处理某个已有的元素的某个状态
  • 优先级

!important(权重:无限大) > 行内样式(权重:1000) > ID选择器(权重:100) > 类选择器=属性选择器(权重:10) > 元素选择器=伪元素(权重:1) > 通配符选择器(权重:0) > 继承(没有权值) > 浏览器默认属性

150fa3e607caddb8dc38c00ecf881608.gif
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值