css权重及优先级规则(css中哪个权重最低)

css权重及优先级规则(css中哪个权重最低)

编码文章call10242025-04-30 9:56:137A+A-

(1)权值不同时,权值高的样式优先;

(2)权值相同时,后定义的样式优先;

(3)!important的样式绝对优先;

权值等级划分为4个等级:

一级:内联样式

style="color:red",权值为 1,0,0,0

二级:id选择器

#id="color:green", 权值为 0,1,0,0

三级:class|伪类|属性选择器

.class | :hover,:link,:target | [type], 权值为0,0,1,0

四级:标签|伪元素选择器

div | ::after, ::before, 权值 0,0,0,1

通用选择器(*),子选择器(>),兄弟选择器(+)不在这4个等级之内,它们的权值都为 0,0,0,0。

继承的样式没有优先级。

示例1:

<view class="cs1" style="background-color:red">
区域1
</view>
.cs1{
    background-color: goldenrod;//金黄色
}

同时具有class样式和style样式,style样式生效。

实例2:

.cs1{
background-color: goldenrod!important;
}

如果在class样式中加上!important,则该样式生效。

点击这里复制本文地址 以上内容由文彬编程网整理呈现,请务必在转载分享时注明本文地址!如对内容有疑问,请联系我们,谢谢!
qrcode

文彬编程网 © All Rights Reserved.  蜀ICP备2024111239号-4