如果兄弟元素存在于PURE CSS中，则有条件地设置样式

Question

我有以下结构，其中第二个元素可能出现也可能不出现。

<div class="wrapper">
    <div class="firstElement"></div>
    <div class="secondElement"></div>
</div>

如果.firstElement存在，我只想在.secondElement上有条件地设置样式。

有没有办法用PURE CSS做到这一点？有兄弟选择器/父选择器吗？

谢谢！

Answer 1

一般来说，没有。 CSS在DOM中向前/向下读取 - 它不会向后/向后读取。但是使用此标记，您可以使用:not(:last-child)

.firstElement:not(:last-child) {
  color: red
}

<div class="wrapper">
    <div class="firstElement">target this</div>
    <div class="secondElement"></div>
</div>

<div class="wrapper">
    <div class="firstElement">not this</div>
</div>