CSSでブロックレベル要素をロールオーバーさせる

こんにちわ

アンカータグにマウスが乗った場合に、
属する親ブロックレベル要素のスタイルを変更するのは
どのように行うのでしょうか？

#HTML
<div class="box">
<p>タイトル</p>
<p><a href="#">あいうえお</a></p>
</div>

#CSS
通常時
div.box{
border: 1px #dddddd solid;
}
ロールオーバー時
div.box{
border: 1px red solid;
}

No.1 ベストアンサー 回答者： ORUKA1951 回答日時： 2010/03/10 16:29

5.11.3 動的な疑似クラス (

http://www.swlab.it.okayama-u.ac.jp/man/rec-css2 … )
を使用します。

この回答へのお礼

回答ありがとうございます。
大変勉強になりました。

お礼日時：2010/03/19 08:42

No.3 回答者： hujitomo 回答日時： 2010/03/11 22:19

#HTML

<div id="parent" class="box">
<p>タイトル</p>
<p><a href="#" OnMouseOver="changeclass('parent','box2');" OnMouseOut="changeclass('parent','box');">あいうえお</a></p>
</div>

#CSS
<style type="text/css">
<!--
/*　通常時　*/
div.box{
border: 1px #dddddd solid;
}
/*　ロールオーバー時　*/
div.box2{
border: 1px red solid;
}
-->
</style>

#JavaScript
<script type="text/javascript">
<!--
function changeclass(id,class){
document.getElementById(id).className=class;
}
//-->
</script>

この回答へのお礼

具体的ソースありがとうございます。
参考にさせていただきます。

お礼日時：2010/03/19 09:10

No.2 回答者： yambejp 回答日時： 2010/03/11 13:45

cssで疑似クラスをつかっても親ノードをいじるのは難しいと思います。

無理やりやるならjavascript？

この回答へのお礼

ご意見ありがとうございます。
どこかのサイトでみた記憶があるので
何かしらの方法がありそうです。

お礼日時：2010/03/19 08:43