css选择器权重介绍

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

 

选择器	表达式或示例	说明	权重
行内选择器	style=""		1000
id选择器	#aaa		100
类选择器	.aaa		10
标签选择器	h1	元素的tagname	1
属性选择器	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;
}