本文共 1271 字,大约阅读时间需要 4 分钟。
------------------------------------------------------------------------ | 最次要 | <----> | 最重要------------------------------------------------------------------------样式生成于: | 浏览器的默认样式表 | 用户自己定义的样式表 | 页面开发者样式表------------------------------------------------------------------------样式生成于: | 外部样式表 | 内部样式表 | 内联样式表------------------------------------------------------------------------样式生成于: | 元素选择器 | 类选择器 | ID选择器------------------------------------------------------------------------当样式冲突时, CSS中同意使用!important指明样式具有更高的优先级
p{color:blue; !important}
1. 影响页面中元素的位置的属性,或者像margin,background color,border这些属性是不继承的。
2. 浏览器自己定义的一些元素的样式。如link为蓝色的。headline的字体等等。
3. 当css样式冲突时,继承的不会被採用。
第三条事实上指明了css样式应用的还有一个规律:The Directly Applied Style Wins。
当样式存在冲突时,直接运用的样式会被採用。就继承冲突而言还存在还有一条规律:Nearest Ancestor Wins。
这里再讨论下one tag。 many styles的情况,比方:对于一个元素<p>我们既设置了id selector style又设置了class selector style,这样的情况下。如style不存在冲突,所设置的样式会组合起来运用到元素上。
如存在冲突,css提供了一个公式去模拟优先级:
A tag selector is worth 1 point .
A class selector is worth 10 points .
An ID selector is worth 100 points .
An inline style is worth 1000 points .