ホームページ制作 Webデザイン ブログデザイン Web構築 Android linux PHP パソコン情報 ブログ 掲示板
ナビボタンのロールオーバー[CSS]
CSSのみで作成(IE8以降 IE7以下は対象外)
１．１枚の画像でロールオーバーする
画像名:nav_html5.png
<a class="btn01" title="css01" href="#">ロールオーバー</a>
ロールオーバー
２．２枚の画像でロールオーバー
※注意 バックカラーが白などであること
画像名:0001_on.png 00001_off.png
<a class="btn02" title="css02" href="#"><img src="./img/nav_html5_shiro_off.png" alt="css02" width="220" height="50" /></a>
３．マウスオーバー時に透過
４．マウスオーバー時に透過(ゆっくり透過)