p span{color:green;} /*权值为1+1=2*/ 这个我理解为是p的后代选择器选择了span,所以span的权重为2 大于单独设置span
p span.warning{color:purple;} /*权值为1+1+10=12*/
#footer .note p{color:yellow;} /*权值为100+10+1=111*/
这两个就不懂了,代表了什么意思呢,p选的后代的span 再选择类选择的.warning?
p span.warning{color:purple;} /*权值为1+1+10=12*/
#footer .note p{color:yellow;} /*权值为100+10+1=111*/
跟第一条是一样的计算方法,第二条p span 为1+1 .warning权值为10,所以第二条为1+1+10=12
第三条#footer权值为100 .note权值为10,p权值为1,第三条就是100+10+1=111
例子:<p><span class:"warning">内容</span></p>
即是产生的变化是采用p span.warning{}里的样式
标签权值是1,类选择符的权值为10,ID选择符的权值最高为100。第一个p span{color:green;} p的权值为1 span的权值为1,所以1+1=2是因为p的权值加上span的权值为2。
差不多是这样吧,我也是这样理解的
p和span是1 ,.warning是10
意思是p标签里span标签内class为warning的标签样式
直接后代,间接后代的意思 ,平时用的很少,计算权值 只管元素选择器是1 ,类选择器是10,id选择器是100即可