css - CSS-选择除第一个 child 以外的所有 child

我有以下几点：

<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，是否可以为每个元素<p>和.chapter选择除第一个元素之外的所有元素.section？例如，我想选择<p>chapter 1, paragraph 2</p>，<p>chapter 1, section 1, paragraph 2</p>，<p>chapter 2, section 1, paragraph 2</p>，<p>chapter 2, section 2, paragraph 2</p>，依此类推。

谢谢。

最佳答案

您应将: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>

关于css - CSS-选择除第一个 child 以外的所有 child ，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/27083415/