CSSでボタンのロールオーバーをデザインする【2】CSS（スタイルシート）の色々なテクニックや知識を紹介していく「CSS 3分コーディング」のコーナーです。 はじまりはじまり。 「CSSでボタンのロールオーバーをデザインする【1】」とは違う方法をご紹介します。 以前ご紹介した方法は、ロールーオーバーする前、した後、いずれもbackground-imageで画像を配置していました。つまり、HTMLソース内には画像はありません。 ソースはこんなかんじでした。 <ul> <li><a href="#">Link 1</a></li> <li><a href="#">Link 2</a></li> <li><a href="#">Link 3</a></li> </ul> 今回は、img要素を使って画像を配置していて、なおかつCSSのみでロールオーバーをデザインする方法をご紹介します。 このように、背景画像ではなくimg要素を使いたいケースもある
