画像ロールオーバー

マウスのカーソルをあてると、画像を切り替える動き。

ボタンとか。

サンプルはボタン画像のみでテキストを入力表示していますよ。

■CSS

#side li a {

background: url("img/side_menu_on.png") no-repeat;

text-decoration: none;

display: block;

position: relative; /* IE6用 */

}

#side li a:hover {

background: url("img/side_menu_off.png") no-repeat;

}

■HTML

<div id="side">

<ul>

<li><a href="<$MTBlogURL$>askul/">アスクル事業部<br />ASKUL</a></li>

</ul>

</div>