CSS:悬停在其他元素上?

Short question: Why does the background-color of .b does not change when I hover? .a?

CSS

.a {
    color: red;
}

.b {
    color: orange;
}

.a:hover .b {
    background-color: blue;
}

HTML

<div id="wrap">
    <div class="a">AAAA</div>
    <div class ="b">BBBB</div>
</div>

http://jsfiddle.net/2NEgt/

推荐答案

你需要有 .a:hover + .b 而不是 .a:hover .b

.a:hover .b 适用于像

<div class="a">AAAA
  <div class ="b">BBBB</div>
</div>

如果在某些时候您需要在 .a 和 .b 之间添加一些元素，那么您需要使用 .a:hover ~ .b，它适用于 .a 的所有兄弟姐妹都在它之后，而不仅仅是下一个.