选择多个相邻的兄弟姐妹（及其孩子）

【问题标题】：Selecting multiple adjacent siblings (and their children)选择多个相邻的兄弟姐妹（及其孩子）
【发布时间】：2014-07-06 19:43:05
【问题描述】：

当我将鼠标悬停在 div 上时，如何更改其 2 个兄弟姐妹的样式？

#magic:hover + (#sibling1 > span, #sibling2 > span){color: blue}

【问题讨论】：

【解决方案1】：

为什么不使用相邻选择器来实现呢？

#magic:hover + #sibling1 + #sibling2 span {
    color: red;
}

Demo （悬停第一个元素，查看第三个元素的颜色变化）

如果你想改变#magic后面的所有元素的样式，比使用

#magic:hover + #sibling1 span,
#magic:hover + #sibling1 + #sibling2 span {
    /* Styles goes here */
}

【讨论】：

【解决方案2】：

更新了这个fiddle

#magic:hover ~ .box span {color: blue}

【讨论】：