CSS优先级
级联将结合重要性、具体性(或称为特殊性:Specificity)以及出现的顺序来决定每一种样式属性的权重, 这个权重将会用来决定浏览器将会采用哪一种样式属性,权重高的则优先使用(具有更高的作用优先级)。
CSS优先级(权重)计算
-
对于一个给定的样式属性,例如color,先找出应用到某一个指定元素的所有CSS选择器(Selector)
-
根据声明的重要性和来源对选择器进行排位
-
根据具体性(Specificity)来对拥有同样重要性的选择器进行排拉
-
最后,如果重要性、起源和特异度都一样的话,将根据样式属性出现的顺序来排拉,后来者居上,最后一个出现的获胜。
优先级总结
- 不同级别元素
- 在属性后面使用 !important会覆盖页面内任何位置定义的元素样式。
- 作为style属性写在元素内的样式(1000)
- id选择器(100)
- 类选择器(10)
- 标签选择器(1)
- 通配符选择器
- 浏览器自定义或继承
总结排序:!important > 行内样式>ID选择器 > 类选择器 > 标签 > 通配符 > 继承 > 浏览器默认属性
- 同级别元素
- 在后写的css会覆盖前面的