.blue{color:blue;} /*权重=10*/
div ul li div form div table tbody tr td p span{color:red;} /*权重=12*/
<div>
<ul>
<li>
<div>
<form>
<div>
<table>
<tbody>
<tr>
<td>
<p>sdf<span class="blue">SDFSDF</span>sdfsdf</p>
</td>
</tr>
</tbody>
</table>
</div>
</form>
</div>
</li>
</ul>
</div>
百度了下，好像是这个意思：
权重值是(A, B, C)
其中A的值是ID选择器的数量，B的值是类选择器，属性选择器和伪类的数量，C的值是类型选择器和伪元素的数量。
比较方式是A的值谁大就是谁，只有A相同了才会比较B，C同理。
那上面的权重就是这样：
.blue{color:blue;} /*权重=(0,1,0)*/
div ul li div form div table tbody tr td p span{color:red;} /*权重=(0,0,12)*/
所以上面那个权重更大
div ul li div form div table tbody tr td p span{color:red;} /*权重=12*/ 不是12 进制不对
前面章节说了CSS样式设置优先级：内联式>嵌入式
越靠近你要设置的目标的css优先级越高，权重高只是相比于同等位置的时候才按照权重决定css的优先级
<p>sdf<span class="blue">SDFSDF</span>sdfsdf</p> 因为内部还是设置的蓝色，这是内层的颜色会先显示出来，相当于把外层的颜色覆盖掉了。所以他直接决定了颜色为蓝色。