CSS 选择器的优先级!important ,style,id,class,标签，后代选择器和子代选择器

一、固定的优先级：

CSS选择器的优先级（从上至下，依次递减，权重值相同另考虑）：

选择器	权重
!important	Infinity，“无穷大”（无法被超越）
行内样式（style=“”）	1000
id选择器（#id）	100
类选择器（.className）	10
属性选择器（a[rel="external"]）	10
伪类选择器（a:hover,li:nth-child）	10
标签选择器（div,h1,p）	1
伪元素选择器	1
子选择器、相邻选择器	0
通配符选择器（*）	0

注意：如果选择器的权重相同，优先级以代码出现的先后顺序，后出现的选择器样式为最终样式。通过js控制的样式也是最终样式。

二、变化的优先级：

相邻选择器（h1+p）
子选择器（ul>li）
后代选择器（li a）

判断优先级，以权重为指标，权重越大优先级越高：

一般约定 id选择器的权重为100，类选择器权重为10，标签选择器权重为1。

一个复杂的选择器的权重等于所有选择器的权重之和。

在后代选择器中其权重值达到了100+1=101超过了id选择器，所以可以排到id选择器之前。

!important的优先级虽然是最高的，不过如果出现相同的!important，那么就会再次对比选择器的优先级谁高，决定最终使用哪个样式。