关闭

css的某些特殊属性

标签: 权值
161人阅读 评论(0) 收藏 举报
分类:

当我们为同一个元素设置了两个css属性时,这个元素会使用哪一个属性呢?

<p class="style">css特殊性</p>
p{
    color:red;
}
.style{
    color:blue;
}

p和.style都匹配到这个元素上,这个元素会选择哪个呢?浏览器会选择.style。这是根据一个叫做权值的特性来决定的。哪种权值高就使用哪种样式。
权值规则
*标签权值:1
类选择器:10
ID:100*
由此可知:

p{
    color:red;
}权值为1
.style{
    color:blue;
}权值为10

如p span .warning{}的权值为1+1+10=12

问题:当html文件中对于同一个元素可以有多个CSS样式存在,并且这多个CSS样式具有相同的权重值该怎么办?
层叠。在html文件中对于同一个元素可以有多个css样式存在,当有相同权值存在的样式时,会根据css样式的前后顺序来决定。所以出于最后的css样式会被启用。

有时在做网页代码时,有些特殊情况需要为某些样式设置具有最高权值。
!important可以实现

P{
            color:red!important;
    }

最后,一般情况下css样式优先级的排列如下:
内嵌式 > 嵌入式 > 外部css

0
0

查看评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场
    个人资料
    • 访问:4474次
    • 积分:184
    • 等级:
    • 排名:千里之外
    • 原创:15篇
    • 转载:4篇
    • 译文:0篇
    • 评论:0条
    文章分类