CSS-选择除第一个孩子以外的所有孩子

Rui Afonso Pereira 发表于 Dev

瑞·阿方索·佩雷拉

我有以下内容：

<div class="chapter"> 
     <p>chapter 1, paragraph 1</p>
     <p>chapter 1, paragraph 2</p>
     <div class="section">
          <p>chapter 1, section 1, paragraph 1</p>
          <p>chapter 1, section 1, paragraph 2</p>
     </div>
</div>
<div class="chapter"> 
     <p>chapter 2, paragraph 1</p>
     <div class="section">
          <p>chapter 2, section 1, paragraph 1</p>
          <p>chapter 2, section 1, paragraph 2</p>
     </div>
     <div class="section">
          <p>chapter 2, section 2, paragraph 1</p>
          <p>chapter 2, section 2, paragraph 2</p>
     </div>
</div>

使用CSS，是否可以为每个元素.chapter和除第一个元素之外选择所有元素.section？举例来说，我想选择chapter 1, paragraph 2，chapter 1, section 1, paragraph 2，chapter 2, section 1, paragraph 2，chapter 2, section 2, paragraph 2，等。

谢谢。

加布里埃莱·彼得里奥利（Gabriele Petrioli）

您应该:first-of-type结合使用:not

.chapter > p:not(:first-of-type),
.section > p:not(:first-of-type){
  color:#ccc
}

<div class="chapter"> 
     <p>chapter 1, paragraph 1</p>
     <p>chapter 1, paragraph 2</p>
     <div class="section">
          <p>chapter 1, section 1, paragraph 1</p>
          <p>chapter 1, section 1, paragraph 2</p>
     </div>
</div>
<div class="chapter"> 
     <p>chapter 2, paragraph 1</p>
     <div class="section">
          <p>chapter 2, section 1, paragraph 1</p>
          <p>chapter 2, section 1, paragraph 2</p>
          <p>chapter 2, section 1, paragraph 3</p>
          <p>chapter 2, section 1, paragraph 4</p>
     </div>
     <div class="section">
          <p>chapter 2, section 2, paragraph 1</p>
          <p>chapter 2, section 2, paragraph 2</p>
     </div>
</div>