画像置換・javascriptを使わないロールオーバー | LuvlogTag : css, xhtml 以前のエントリーで画像のロールオーバーについて書きましたが、なんだかなぁ。。って感じがしたのでもう一度考え直してみました。 前回は通常の画像とマウスオーバー時の二枚の画像を使いましたが、今回は通常時とマウスオーバー時の画像を繋げた一枚の画像を使います。 Sample ・html -------------------- <p><a href="#"><img src="demo.jpg" width="390" height="200" alt="デモ" /></p> ・css -------------------- p a { display:block; overflow:hidden; width:390px; height:100px; border:5px solid #eee; } p a:hover { position:relative
