CSS ホバーイベントで、別の div のスタイルを変更できますか? [重複] 質問する

Question

はい、それは可能ですが、HTML 内で#bの後の場合のみです。#a

#bの直後に来る場合#a:http://jsfiddle.net/u7tYE/

#a:hover + #b {
    background: #ccc
}

<div id="a">Div A</div>
<div id="b">Div B</div>

それは隣接兄弟結合子（+）。

#aとの間に他の要素がある場合は#b、次のように使用できます。http://jsfiddle.net/u7tYE/1/

#a:hover ~ #b {
    background: #ccc
}

<div id="a">Div A</div>
<div>random other elements</div>
<div>random other elements</div>
<div>random other elements</div>
<div id="b">Div B</div>

それは一般的な兄弟結合子（~）。

どちらも+すべて~の最新ブラウザとIE7+で動作します

#bがの子孫である場合は#a、単にを使用できます#a:hover #b。

代替案: 純粋な CSS を使用して、2 番目の要素を最初の要素の前に配置することで、これを実行できます。最初の div はマークアップでは最初にありますが、2 番目の要素の右または下に配置されます。前の兄弟であるかのように動作します。

Answer 1