在悬停w / o javascript时改变div及其兄弟姐妹的颜色

Question

我有两个divs彼此相邻：

<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更改为父级中的此颜色。但我真的不知道这是否可行。此外，关于css，jquery悬停事件似乎总是非常延迟，所以我试图避免使用脚本。非常感谢！

Answer 1

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

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

Answer 2

将一个类添加到child_1和child_2，将其称为“children”或任何您想要的类。然后使用这个CSS：

.children:hover #child_1 { color: red; }
.children:hover #child_2 { color: yellow; }