css选择器优先级

css三大特点

继承：即子级类元素继承父类的样式；

优先级：是指不同类别样式的权重比较；

层叠：是说当数量相同时，通过层叠（后者覆盖前者）的样式。

首先来看一下css选择器优先级 （css选择器的权值）

css选择器的优先级：作用的元素一样，样式一样，就会有优先级问题。

通配选择器：0权值;  (如：*)

标签名选择器：1权值；（如：div，body，span，p,ul,li）

类名选择器：10权值; (如：class="head",class="head_logo")

id选择器：100权值;（如：id="name",id="name_txt"）

内联样式表：1000权值；

后代选择器：选择器1  选择器2....（会有相加的过程）

群组选择器：选择器1，选择器2....（不会有相加的过程）

1.相同类型选择器，样式冲突下，后面的代码覆盖前面的代码。

2.不同类型的选择器，样式冲突下，优先级高的覆盖优先级低的。

3.* < Tags < class < id < style < !important

4. ! important慎用！【优先级最高，谁也覆盖不了，慎用，非得用的时候，要加上注释说明一下；它们之间的优先级是绝对的，低级的优先级累加不能超过高级的优先级。】

总结排序：！important > 行间样式 > id选择器 > 类选择器 > 标签选择器 > 通配选择器 ;

                    !important   >  style  >  id  >  class  >  Tags  >*;

我们可以把选择器中规则对应做加法，比较权值，如果权值相同那就后面的覆盖前面的了，div.class的权值是1+10=11，而.test1 .test2的权值是10+10=20，所以div会应用.test1 .test2变成绿色