五、附加说明
1. 文内的样式优先级为1,0,0,0,所以始终高于外部定义。这里文内样式指形如<div style="color:red">blah</div>的样式,而外部定义指经由<link>或<style>卷标定义的规则。
2. 有!important声明的规则高于一切。
3. 如果!important声明冲突,则比较优先权。
4. 如果优先权一样,则按照在源码中出现的顺序决定,后来者居上。
5. 由继承而得到的样式没有specificity的计算,它低于一切其它规则(比如全局选择符*定义的规则)。
6. 关于经由@import加载的外部样式,由于@import必须出现在所有其它规则定义之前(如不是,则浏览器应该忽略之),所以按照后来居上原则,一般优先权冲突时是占下风的。
还需要说一下,IE是可以识别位置错误的@import的,但无论@import在什么地方,它都认为是位于所有其它规则定义之前的,这可能会引发一些误会。
优先权问题看起来简单,但背后还是有非常复杂的机制,在实际应用中需要多多留意。
六、练习
看完上面的文字后,来做几道非常简单的题目。(自己答完前,请不要先看各题给出的链接地址哦)
1. 如何让使用两个使用相同样式名的元素具有不同的效果:css优先级测试
固定效果: 
固定代码: <div class="test">传说中的测试</div>
<p class="test">传说中的测试</p>
2. 如何让<h3>始终为黑色,而<em>在不被<h3>包含的情况为红色:css优先级测试
固定效果: 
固定代码: <h3>讨论<em>CSS</em>优先级</h3>
<p>讨论<em>CSS</em>优先级</p>
3. 如何写一个外部样式使得<h3 style="color:#000;"> 覆盖我</h3>的颜色为红色:css优先级测试
4. 如何让同时具有.a,.b样式的元素只表现.a的颜色样式:css优先级测试
固定代码:<p class="a b">传说中滴测试</p>
关于样式优先级,今天就先聊到这。










