Html 当鼠标悬停在另一个元素（具有不同的父元素）上时，如何设置完全不同的元素的样式？

我知道如何在将鼠标悬停在不同的元素上时更改元素，但我想知道的是，我是否可以实际更改位于与悬停元素完全不同的父元素中的元素的样式，而不是使用+或>…ect来设置同级元素的样式。例如，如果我有这样一个HTML结构

<div id="firstParent">

     <div id="firstParentInner">
         <a id="hoverMe">Hello world</a>
     </div>

</div>


<div id="randomDiv"></div>


<div id="changeMyInner">
      <div id="changeMyChild">
         <div id="changeMe"></div>
      </div>
</div>

谢谢

简言之-不

有3种可能的情况：

直接位于父元素内的元素：

#container:hover>.column{背景色：黑色；}

如果元素与其他元素相邻：

.column:hover+.column{背景色：黑色；}

如果元素在父元素中的某个位置，则在任何位置：

#容器：hover.element{背景色：黑色；}

---

仅此而已。

不……没有CSS选择器允许您这样做。你需要Javascriptok谢谢，值得一试！np，若你们能接受这个问题的答案，那个就好了。最好的，戈兰

#firstParent #hoverMe:hover ~ #changeMyInner #changeMe{
     background: red;
}