Html 将鼠标悬停在特定div上-更改另一个div

我想在将鼠标悬停在另一个div上时更改该div的背景色。第一个div将是黑色的，但悬停在上方时不会改变。当鼠标悬停在第二个div上时，该div上的背景将变为黑色，而第一个div将变为白色。我以前做过，但现在好像已经不行了

CSS

.svart {
    background-color: black;
}

.hvit {
    background-color: white;
}

.hvit:hover {
    background-color: black;
}

HTML

 <div id="bestill_forside" class="svart">
    One
    </div>

    <div id="lear_forside" class="hvit">
    Two
</div>

---

.svart

必须位于文档中的

.hvit

下方，您不能在CSS中选择以前的元素：

    <div id="lear_forside" class="hvit">
    Two
    </div>
    <div id="bestill_forside" class="svart">
    One
    </div>

阅读有关CSS选择器的更多信息：

---

在不更改标记的情况下，使用CSS无法做到这一点。CSS没有任何以前的选择器。我建议使用JavaScript或jQuery。

    <div id="lear_forside" class="hvit">
    Two
    </div>
    <div id="bestill_forside" class="svart">
    One
    </div>

.hvit:hover .svart {
        background-color: white; */This Selected .svart inside of .hvit*/
}

.hvit:hover + .svart {
        background-color: white; */This Selected .svart that was a immediate sibling of .hvit*/
}

.hvit:hover > .svart {
        background-color: white; */This Selected .svart that was a direct child of .hvit*/
}