比如有多个选择器选中了同一个元素，且定义的样式是有冲突的，那这个元素会采用哪个选择器定的规则呢？这就是所谓的CSS优先级的问题，浏览器会有一套特殊的评分法则来评定哪类选择器的优先级别更高。
例如，通类选择器（*）的优先级别就很低，而Id选择器的优先级别就很高。
插入样式表的优先级别确实是先后关系决定的，但是那是特指同一种选择器靠的是先后关系。不同的选择器有冲突的情况，靠的是浏览器内部的这套CSS优先级评分法则。有点小复杂，这一节请好好学喔~
如下所示，依次列出的四大类选择器的优先级梯度，从上往下越来越低，行内样式表 > Id选择器 > 类选择器、属性选择器、伪类 > 元素名选择器、伪元素：
请牢记CSS优先级的评分计算法则！这很重要！
按照上面的评分计算法则，举例来演示一下：
A：h1 B：#jerk h1 C：<div id="jerk"><h1 id="color:red;">标题</h1></div>
因为 1 > 101 > 1000，所以C的优先级评分最高。
下面举三个例子，很明显都是符合上述评分计算法则的。
评分相等，后引入的规则更加优先：
h1 {background-color: Blue;}
h1 {background-color: Tomato;}
Id选择器完爆属性选择器：
div#jerk {background-color: LightBlue;}
#jerk {background-color: LightGray;}
div[id=jerk] {background-color: Red;}
类选择器完爆元素名选择器：
.jerk {background-color: LightBlue;}
h1 {background-color: Red;}