相邻的兄弟姐妹不工作 - CSS3选择器

Question

我想对子元素进行:hover更改。

我们说我有以下HTML：

<div class="wrap">
    <div class="adjacent_sibling">Placeholder text</div>
    <div class="adjacent_sibling class">Placeholder text</div>
</div>

我可以使用CSS对子元素进行更改：

.wrap:hover .class {
/*CSS to come here*/
}

但我不能这样做：

.wrap:hover + .wrap > .adjacent-sibling{
/*CSS to come here*/
}

或：

.wrap:hover + .adjacent-sibling {
/*CSS to come here*/
}

如何实现这一目标？ 我需要定位相邻兄弟，如果它是孩子（孩子）。这仅用于学习目的。

Answer 1

+ 指的是邻居元素，而不是儿童。

如果您需要这样的话：

.wrap:hover > .adjacent-sibling,
.wrap > .adjacent-sibling {
/*CSS to come here*/
}

或

.wrap:hover > .adjacent-sibling {
/*CSS to come here*/
}

编辑：如何定位子女中的相邻兄弟姐妹：

.wrap:hover > .adjacent-sibling + .adjacent-sibling.class {
/*CSS to come here*/
}