css - 选择两个元素之间的所有元素

Question

如果我有这个 HTML，如何使用 CSS 选择两个 h2 元素之间的所有元素？我不会使用 jQuery。

<h2 ></h2>
<p></p>
<table></table>
<p></p>
<p></p>
<h2 ></h2>
<p></p>
<p></p>

Answer 1

如果你使用一些 <div>包装您的内容，然后选择此 div 和 :not(h2)应该工作:

.wrapper > :not(h2)

通过使用 > ，您只选择直接 child 。

.wrapper> :not(h2) {
  background-color: rgba(0, 255, 0, .2);
}

<div class="wrapper">
  <h2>heading1</h2>
  <p>paragraph1</p>
  <table>
    <tr>
      <td>el of table</td>
    </tr>
  </table>
  <p>paragraph1</p>
  <p>paragraph1</p>
  <h2>heading2</h2>
</div>

运行代码片段查看结果或访问此笔:https://codepen.io/matysflance/pen/aeGrKe