html - 在没有javascript的情况下悬停时更改div及其 sibling 的颜色

Question

我有两个 div 并排 float :

<div id="parent">
    <div id="child_1" style="float:left"> content </div>
    <div id="child_2" style="float:left"> content </div>
    <div style="clear:both"></div>
</div>

当任一 div 悬停时，我想更改两个 div 的颜色(更改为不同的颜色)。比如说，一个黄色，另一个红色。有没有办法做到这一点？我把 div id="parent" 放在那里，以为当鼠标悬停在上面时我可以做一些事情；在父级中将具有此 ID(或类)的 div 更改为此颜色。但我真的不知道这是否可能。此外，jquery 悬停事件似乎总是相对于 css 非常延迟，所以我试图避免使用脚本。非常感谢!

Answer 1

div#parent:hover div#child_1 {
  color: red;
}

div#parent:hover div#child_2 {
  color: yellow;
}