4回答

• 

  _亓

  2015-12-31 14:40:13

  已采纳

  你看你那个代码里是结构是这样的  .first>span>span。如果用子元素选择器的话 ，他只会选择自己的儿子那一辈也就是说，first>span而不会也选择到后面那个span，如果是后台选择器的话，只要是他的后台都有选择。所以两个span都会加一个红边框，所以就会出现两个边框，所以就会有框间隔。恩 就是这样
  

  0 0
• 

  Perona

  2015-12-31 14:47:29

  首先明白下，后代选择器是作用于所有后代（包含子代），子代选择器只作用于第一代。

  html结构如下

  <p class="first fir">三年级时，
      <span>我还是一个    
          <span>胆小如鼠</span>的小女孩
      </span>，上课从来不敢回答老师提出的问题，生怕回答错了老师会批评我。就一直没有这个勇气来回答老师提出的问题。学校举办的活动我也没勇气参加。
  </p>

  .first>span{
      border:1px solid red;
  }

  这里只作用于第一个span元素，所以只有第一个span元素有边框。也就是从“我还是一个胆小如鼠的小女孩”是有边框。

  而

  .first span{
      border:1px solid red;
  }

  这里作用于全部span后代，除了子代的span元素，还有“胆小如鼠”这个孙代。所以这里有2个边框，一个是外面span元素的边框，一个是里面span元素的边框。所以看起来就有框间隔。
  

  
  

  0 0
• 

  qq_天涯_17

  2015-12-31 14:45:04

  <span>我还是一个<span>胆小如鼠</span>的小女孩</span>你用后代选择器，这里有两个后代，第一个：<span>我还是一个<span>胆小如鼠</span>，第二个：<span>胆小如鼠</span>的小女孩</span>，所以，第一个框框的是”我还是一个胆小如鼠“，第二框框的是”胆小如鼠的小女孩“，连起就是你描述的那样了。而在子选择器中，”<span>我还是一个<span>胆小如鼠</span>的小女孩</span>“，这就是一个整体，就一框全部。

  0 0
• 

  起名字真烦

  2015-12-31 14:44:59

  到了下一节才注意到dom结构，是一个span里面还有个小span，刚才看到两个span并列了

  0 0