css选择器权重

多个选择器选中同一个标签且属性相同时需要看权重来确定被谁控制。

这里选择一个a(超链接)标签来进行研究:

先用element选择器进行样式设计,再这种情况在,此超链接标签只受element选择器的控制。

<style>
    a{
        color: rgb(13, 81, 81);
        background-color: rgb(244, 189, 107);
    }
</style>
<body>
    <a href="">超链接标签</a>
</body>

接下来我们加入类选择器classa:

此时超链接标签的样式已经变成由类选择器来控制了

由此可见类选择器的优先级要大于element选择器,在标签样式的设置上,这两个标签可以很方便的进行设置。

再加入id选择器后,id选择器的内容被表现出来,说明id选择器权重大于前两个。

得到了id>class>element

选择的等级越详细,权重越高。但是认为规定的!important是不受权重限制的,是权重最高的!!!

最后得到的权重值:行内样式>id>class>element。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值