CSS：权重

权重等级

4 个等级的定义如下：
第一等：代表内联样式，如: style=""，权值为1000。
第二等：代表ID选择器，如：#content，权值为100。
第三等：代表类，伪类和属性选择器，如 .content，权值为10。
第四等：代表元素和伪元素选择器，如 h2、:before 与 :after，权值为1。

权重值

从 0 开始，一个行内样式 +1000，一个 ID +100，一个属性选择器/class/伪类 +10，一个元素名/伪元素 +1。

等级	例子	权重值
行内样式	style	1000
ID	#nav	100
属性选择器/class/伪类	:hover	10
元素名/伪元素	::after	1

权重的基本规则

1. 相同的权重：以后面出现的选择器为最后规则
2. 不同的权重，权重值高则生效

CSS 权重规则

1. 包含更高权重选择器的一条规则拥有更高的权重。
2. ID 选择器的权重比属性选择器高。
3. 带有上下文关系的选择器比单纯的元素选择器权重要高。
4. 与元素 挨得近 的规则生效，html 中规则的比 CSS 文件的优先。
5. 最后定义的这条规则会覆盖上面与之冲突的规则。
6. 无论多少个元素组成的选择器，都没有一个class选择器权重高。
7. 通配符选择器也有权重，权重被认为是 0。

永远都不要使用 !important。

参考

• 你应该知道的一些事情——CSS权重：原文
• 你应该知道的一些事情——CSS权重：译文
• CSS选择器的权重计算规则