选择第一个元素，该元素放置在另一个元素之后，但不立即放置 [英] Select first element which is placed after another element but not immediately

问题描述

如何仅在另一个元素(例如h1)之后选择仅第一个元素(例如h2)，但不一定紧随其后?
因此，element + element(例如h1 + h2)不起作用，因为它会选择立即放置在元素

How is it possible to select only the first element (e.g. h2) after another element (e.g. h1) but which is not necessarily placed immediately after ?
So, element+element (e.g. h1 + h2) does not work because it selects elements that are placed immediately after elements

<h1> Title1 </h1>
..... <--! many tags but h2 -->
<h2> h2 Title2 selected </h2>
..... <--! many tags but h1 and h2-->
<h2> h2 Title3 not selected </h2>

推荐答案

我不认为您可以使用一个选择器来实现这一目标，因此您可以尝试以下操作:

I don't think you can achieve this with one selector, so you can try something like below:

h1:first-of-type ~ h2 {
  color:red;
}
h1:first-of-type ~ h2 ~ h2 {
  color:initial; /*we reset the style for the others*/
}

<div>
  <h2>h2 Title3 not selected </h2>
  <h1> Title1 </h1>
  <p>text</p>
  <h2> h2 Title2 selected </h2>
  <h3>text</h3>
  <h2> h2 Title3 not selected </h2>
</div>

这篇关于选择第一个元素，该元素放置在另一个元素之后，但不立即放置的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！