使用CSS更改兄弟悬停时的元素样式

Question

我有以下结构：

<div id="e1">
  <h1>Header</h1>
  <div id="main">text text text text</div>
  <div id="footer">something</div>
</div>

我想让<h1>变成蓝色，例如当页脚悬停时。我知道我可以用Javascript来做，但我想知道如果你可能知道一些CSS技巧，没有。

谢谢！

Answer 1

你的h1出现在#footer之前，所以纯CSS无法实现，因为它没有提供匹配前一个兄弟元素的选择器。

Answer 2

#e1:hover {
      color:red;
}

#main, #footer{
    color:black 
}

另一种选择。

Answer 3

我已经以某种方式实现了它，而不是改变html结构和纯CSS。

在jsfiddle中查看：http://jsfiddle.net/ijse/dhcqw/