CSS选择器优先级概括

一、简述

在CSS中，我们使用选择器选择特定的元素然后对元素中内容添加样式，但是有时候多个选择器可能同时选择一个元素，比如一个元素同时被类选择器和元素选择器同时选择，这时我们就需要依靠元素选择器来判断应该使用哪一个选择器。
首先了解一些简单概念：

继承：即子类元素继承父类的样式;
1.元素选择器(如：div,p,ul,li,span)

2.类选择器(如：class=“class1”)

3.ID选择器(如：id=“name”,)

4.全局选择器(如：*号)

5.交集选择器(如：.class1.class2注意两选择器用空格键分开)

6.后代选择器 (如： ul li 从父集到子孙集的选择器)

7.并集选择器 div,span,img {color:Red} 即具有相同样式的标签分组显示

8.继承选择器(如：div p,注意两选择器用空格键分开)

9.伪类选择器(如：就是链接样式,a元素的伪类，4种不同的状态：link、visited（其中link和visited是超链接专有样式）、active、hover。)

10.字符串匹配的属性选择符(^ =$= *=三种，分别为开始、结尾、包含)

11.子选择器 (如：div>p ,带大于号>)

12.CSS 相邻兄弟选择器器 (如：h1+p,带加号+)

二、优先级排行

内联选择器>id选择器>类选择器>元素选择器>通用选择器

三、优先级对于复合选择器

（1）最高：在元素样式后面加上 !important如color:red !i,mportant;

（2）第二高：使用内联选择器

（3）其他选择器复合问题
假设优先级为1000(id选择器),100（类选择器）,10（元素选择器）,1（通用选择器）

则在使用复合选择器时，对优先级进行相加，值大的优先（注：低位选择器无论多少个相加也不能高于高位选择器，并集选择器逗号两边的元素各自单独计算优先级，各自生效）

(4)继承元素优先级为0，及继承父类元素的样式的子元素的优先级最低。

四、总结

总的来看可以认为越具体越优先，越广泛越不优先。