问答详情
源自:9-3 权值计算-特殊性

这两行代码表达的什么意思?看不懂!

p span.warning{color:purple;} /*权值为1+1+10=12*/

#footer .note p{color:yellow;} /*权值为100+10+1=111*/

提问者:qq_何必忙著為自己解釋_03169832 2016-07-27 11:13

个回答

  • qq_何必忙著為自己解釋_03169832
    2016-07-27 23:44:25

    我的理解:

    p span.warning{color:purple;} 第一个空格表是后代选择器,而span.warning{}是表示span定义的class=warning,精确定位span元素采用的类选择器。<span class="warning"></span>

    p span .warning{color:purple;} 同理,因为warning为span的子元素,且class为warning 采用的后代选择器<span><a class="warning"></a></span> 

    第一种中的span和warning 为同级关系,第二种中的warning为span的子元素

  • 穗积
    2016-07-27 11:30:03

    标签的权值为1 类选择器的权值为10,id选择器的权值为100,p 和span是标签。warning和note是类选择器。footer是id选择器,在css设置中,当选择有冲突的时候,会选择权值高的。比如.warning{color:pink;}这个权值只是10,而p span.warning{color:purple;}权值是12,所以网页显示的颜色是purple而不是pink;下面那句话是一样的道理。

  • 不再停留0
    2016-07-27 11:17:27

    权值大小,表示同时对p标签设置颜色,有限使用那个颜色