# CSS 的继承与优先级
CSS 默认情况下遵循就近原则; 比如当有多个相同的 CSS 选择器出现的时候, 距离标签最近的选择器将作用在标签上;
问题
如何理解相同的 CSS 选择器? 即选择器同名, 拥有的属性也相同, 但是属性值不同;
- 每个元素(标签)贡献值为 0001 ;
- 每个类, 伪类贡献值为 0010 ;
- 每个 id 的贡献值为 0100 ;
- 每个行内样式贡献值为 1000 ;
- !important 贡献值为 无穷 ;
TIP
CSS 优先级最复杂的地方会表现在选择器上, 权重是可以叠加的, 但是权重不存在进位的情况, 换句话说, 无数个类也抵不上一个 id , 务必牢记此点
其次, 注意一下 !important
的用法,
/* !important 写在分号内部 */
span {
color: orange!important;
}
1
2
3
4
2
3
4