Question

我试图通过悬停其兄弟元素来操纵元素的兄弟。我这样做：

.sw_2-technik + .sw_2-emotionen{
    background:green;
}

.sw_2-emotionen:hover ~ .sw_2-technik{
    background:orange;
}

而html结构有点像：

<section class="wrapper">
<div class="sw_2-technik"></div>
<div class="sw_2-emotionen"></div>
</section>

虽然第一个操作很好，但第二个操作（.sw_2-emotionen：hover~ .sw_2-technik）什么都不做。我在那里做错了什么？

谢谢！

Answer 1

兄弟选择器仅在第二个元素出现在页面上的第一个元素之后影响元素 - 而不是相反。

〜combinator分隔两个选择器并匹配第二个元素仅当它在第一个之前，并且两者共享一个共同的父元素。