このぺージはロールオーバーボタンのＣＳＳ部分に解説が書かれています。
ＨＴＭＬソースを表示してコピーするなどしてご利用下さい。

ここをクリックするとこのページと使用した素材をダウンロードすることもできます。（Ｌｚｈファイル）

■ロールオーバーボタンの例
　 ※このページ内のボタンのリンク先はすべてこのページ自身です。

リンクA

■応用１　＞テーブルレイアウトで横一列にロールオーバーボタンを並べたメニュー

CSSとULタグを用いて横一列に表示する方法もありますが、少し手続きが複雑なのでここでは述べません。

詳しく知りたい方はこちらのサイトにありますので参考にしてください。
→Ｗｅｂ工房きくちゃん〜スタイルシートデザインをはじめたい方へ

ＣＳＳについて初歩から上級テクニックまでステップを踏んでわかりやすく解説してあり、大変勉強になるサイトです。

■応用２

文字入りの画像をロールオーバーさせたい場合は、少々面倒ですが必要な画像分のスタイルシートを追加することになります。

スタイルシートを共通部分と変化する部分に別けておき、ＨＴＭＬで必要なもの同士を組み合わせて指定してあります。