p{color:red;} /*权值为1*/ p span{color:green;} /*权值为1+1=2*/ .warning{color:white;} /*权值为10*/ p span.warning{color:purple;} /*权值为1+1+10=12*/ #footer .note p{color:yellow;} /*权值为100+10+1=111*/
代码中的第二行、四、五行的注释怎么理解?
还有第二行 p标签选择器加空格加上span标签选择器怎么理解?
咱们先复习下权值,标签的权值为1,类选择符的权值为10,ID选择符的权值最高为100。
第二行不是有2个标签,那么权值就是1+1=2。那么 p span是什么意思呢?就是p标签下的span标签。
第四行有2个标签和一个类标签,那么权值就是1+1+10=12。p span.warning就是p标签下的span标签下的类选择符warning。
第五行是一个id选择符和一个类选择符,权值就是100+10+1=111。#footer .note就是id选择符下的类选择符note。