仅当前一个div存在时才应用css规则

Question

如果我有div-a和div-b，是否可以仅在div-b存在的情况下将css规则应用于div-a？或者只有div-b存在时才将规则应用于div-a？ （不使用jQuery）。

<div class="box">
<div class="div-a>..</div>
<div class="div-b>..</div>
</div>

Answer 1

一般来说，没有。除非div-b是div-a的孩子或兄弟。

对于任何后代：

.div-a .div-b

直接儿童：

.div-a > .div-b

兄弟姐妹：

.div-a ~ .div-b

对于邻近的兄弟姐妹：

.div-a + .div-b

请参阅child and sibling selectors。

请注意，这些关系仅适用于一种方式。在我上面提供的所有情况中，它们都应用于div-b，但仅当div-b在（child）内或在（兄弟）div-a之后。鉴于您的加价，您可以使用sibling或adjacent sibling组合器来设置div-b的样式，但无法有条件地设置div-a样式。

我认为最好的选择是如果父类包含div-b，则向父类添加一个额外的类。然后你可以简单地使用简单的组合选择器.parent-class .div-a来设置它的样式。