仅当标头紧随具有特定类的div之后，才更改样式

Question

在以下标记中：

<div class="dynamic-div">Just a text</div>
<h3>A Header</h3>

<h3>A Header</h3>

<div class="dynamic-div">Just a text</div>
<h3>A Header</h3>

<h3>A Header</h3>

<h3>A Header</h3>

我只想将h3标头的颜色更改为红色，除非它紧接在带有dynamic-div类的div之后。

如何使用CSS做到这一点？

Answer 1

添加以下CSS，该+符号是相邻的同级选择器

.dynamic-div + h3 {
  color: red;
}

<div class="dynamic-div">Just a text</div>
<h3>A Header</h3>
<h3>A Header</h3>
<div class="dynamic-div">Just a text</div>
<h3>A Header</h3>
<h3>A Header</h3>
<h3>A Header</h3>