css选择器权重介绍

选择器与伪元素的权重情况:高权重的选择会覆盖低权重的展示样式

 

选择器表达式或示例说明权重
行内选择器style="" 1000

id选择器

#aaa 100
类选择器.aaa 10
标签选择器h1元素的tagname1
属性选择器img[alt]、div[class^='pus'] 10
相邻选择器selecter+selecter拆分成两个选择器在计算 
兄长选择器selecter ~ selecter拆分成两个选择器在计算 
后代选择器selecter selecter拆分成两个选择器在计算 
通配符选择器* 0
各种伪类选择器如:link 、:visited 、:hover等10
各种伪元素如::first-child 、::after 、 ::before等1

!important

!important允许开发人员强制应用某样式。用法卸载该样式的某属性值后,结束分号前,以便强制应用该样式

div{
    backgroud-color: red !important;
}

 

©️2020 CSDN 皮肤主题: 技术黑板 设计师:CSDN官方博客 返回首页