ロールオーバーで変化をするボタンを作る方法 ロールオーバーのボタンを作るのに、無数の作り方があると思いますが、 ここでは再度確認を含めて5つのパターンを掲載してみます。 ロールオーバーはCSSで表現、またはJavaScriptで切替を行ってみます。 ■ タイプ1 CSSで作り、画像を2枚を差し替えて表現をする方法 テキスト これが最もベーシックな作り方でしょうか。 aタグを「display: block;」でブロック要素にしてリンクの範囲を広げます。 画像は1枚目を「a」で指定、2枚目を「a:hover」で指定することで切替を行っています。 -CSS- #nav li { list-style-type: none; } #nav li a { display: block; height: 19px; width: 125px; text-decoration: none; font-s