CSS for same level

问题

If I have 3 divs at the same level ( not one in another ) . How can I change the color of the other div when hover one without using IDs and classes. I would like somthing like :

<div id="1" ></div>
<div></div>
<div></div>

And CSS :

#1 :hover < body > div
{
    //Here I change the things
}

回答1:

Use the general sibling combinator

#yourId:hover ~ div
{
    color:red;
}

Also note that Id's must begin with a letter. W3 ID Attribute

Example

回答2:

Put a wrapper around them, then put the hover on the wrapper.

<div class="wrapper">
    <div class="element">foo</div>
    <div class="element">bar</div>
    <div class="element">baz</div>
</div>

.wrapper:hover .element {
    color: red;
}

Example: http://jsfiddle.net/EB92r/

来源：https://stackoverflow.com/questions/10442336/css-for-same-level