在悬停事件期间将元素B的样式更改为A

Question

如果元素A在元素B下面的DOM中，当将鼠标移到元素A上时如何更改元素B的样式？

例如：

<div id="B">Text</div>
<button id="A">Btn</button>

以下不起作用：

#A:hover + #B {color: red;}
#A:hover ~ #B {color: red;}
#A:hover #B {color: red;}

Answer 1

编辑：好的，此问题现在不正确，因为问题已被修改。 （作者的错误）。

您必须将自己的ID反转为：#B:hover + #A {color: red;}

因为它的“当悬停#B时，将下一个元素定位到#A并添加颜色：红色；”

#B:hover + #A {color: red;}

<div id="B">Text</div>
<button id="A">Btn</button>