CSS样式表的优先级

什么是css优先级

浏览器需要判断哪些css样式与html元素最相关，并选择最相关的用在该元素上。

优先级详解

4种权值（1最大）

1、内联样式

<span style="color:black">...</span>

2、ID选择符

<style>#nav{...}</style><div id="nav">...</div>

3、class选择符

<style>.nav{...}</style><div class="nav">...</div>

4、标签选择符

比如 div 等

可以看到id、class和标签（比如div）的样式表同时存在时、
id>class>div

优先级法则

1、权值越大越优先
2、权值相同时，后出现的样式表设置要优于先出现的样式表设置
3、在同一组属性设置中标有“!important”规则的优先级最大
4、css的位置优先级为（内联样式>内部样式表>外部css文件样式表）