[CSS]CSS 만으로 구현하는 롤오버 이미지

롤오버 하는 방법은 여러가지이나, css로 하는 방법입니다.

 

 

<style type="text/css">
a.rollover img { border-width:0px; display:inline; }
a.rollover img.over { display:none; }
a.rollover:hover { border:0px }
a.rollover:hover img { display:none; }
a.rollover:hover img.over { display:inline; }
</style>

 

<a href="주소" class="rollover"><img src="기본이미지"><img src="마우스 오버시 보여줄 이미지" class="over"></a>