问答详情
源自:8-10 给选择器分个组 - 分组选择器

#second span与span

使用.first,span{color:green;}时,第一段所有文字和第二段文字“简单”变为绿色;

使用.first,#second span{color:green;},第一段(除了“胆小如鼠”四个字)所有文字和第二段文字“简单”变为绿色。

58b0434a0001032105000334.jpg

58b0434b0001491c05000331.jpg


提问者:qq_时光_91 2017-02-24 22:30

个回答

  • 旅行的风筝
    2017-02-24 23:00:29
    已采纳

    <p class="first>三年级时,我还是一个<span>胆小如鼠</span>的小女孩。</p> ,"胆小如鼠"四个字的在标签span内,而标签p的类选择符first是无法作用于span标签选择符的,所以在使用.first,span{color:green;},显示的时这里设置的span的颜色,但是.first,#second span{color:green;},中只是对ID选择符Second下面的span作用,但在第一段的firt,还是最开始的apan{color="red"}起作用


  • 慕粉1054083532
    2017-03-24 19:34:57

    并不认同最佳答案,首先标签p类的选择符first的确无法选择span,但是span会从p中继承color:green的属性,这里之所以不是绿色的原因是特殊性的原因,《CSS权威指南》里面有提到如下的内容http://img.mukewang.com/58d503a50001aaa607690106.jpg

    如果使用 .first,#second span{color:green}这种写法,此时第一段的<span>元素关于color有两个声明,第一个是继承自.first的green,特殊性为0;第二个是h1,span{color:red;}特殊性是0,0,0,1,比较二者特殊性,自然是red更高,所以最后显示为red

  • 苍梧千央
    2017-02-24 22:44:18

    而第二段里面也是第二个span离得近,所以第一个span设置的红色被第二个span设置的绿色所覆盖

  • 苍梧千央
    2017-02-24 22:42:44

    不清楚你想问什么,我猜是想问为什么两者会有差异?我是这么理解的,你不理解的主要的点应该就是第一种情况里面span和first同时对颜色进行设置的时候谁起效果,因为span离“胆小如鼠”近,所以取红色,而#second span只是针对第二段里面的“简单”进行了颜色设置,并不影响“胆小如鼠”