글
오호..이거좀 실용적인데.
<HTML>
<HEAD>
<TITLE> CSS RollOver </TITLE>
</HEAD>
<BODY>
<style>
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>
<div class="rollover">
<a href="#test" class="rollover"><img src="http://www.blueb.co.kr/bbs/table/JS_50/upload/s_blue.gif"><img src="http://www.blueb.co.kr/bbs/table/JS_50/upload/s_yellow.gif" class="over"></a>
<a href="#test" class="rollover"><img src="http://www.blueb.co.kr/bbs/table/JS_50/upload/s_red.gif"><img src="http://www.blueb.co.kr/bbs/table/JS_50/upload/s_green.gif" class="over"></a>
</div>
</BODY>
</HTML>
이런 기발한 :-)
<HTML>
<HEAD>
<TITLE> CSS RollOver </TITLE>
</HEAD>
<BODY>
<style>
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>
<div class="rollover">
<a href="#test" class="rollover"><img src="http://www.blueb.co.kr/bbs/table/JS_50/upload/s_blue.gif"><img src="http://www.blueb.co.kr/bbs/table/JS_50/upload/s_yellow.gif" class="over"></a>
<a href="#test" class="rollover"><img src="http://www.blueb.co.kr/bbs/table/JS_50/upload/s_red.gif"><img src="http://www.blueb.co.kr/bbs/table/JS_50/upload/s_green.gif" class="over"></a>
</div>
</BODY>
</HTML>
이런 기발한 :-)
'웹스터디 > xhtmlcss' 카테고리의 다른 글
px to em (0) | 2008.11.16 |
---|---|
CSS단위 em / px / pt / % (0) | 2008.11.15 |
pt, px 절대단위를 em단위로 환산(계산)해주는 사이트 (0) | 2008.11.15 |
CSS 검사입니다 (0) | 2008.11.15 |
XHTML/CSS를 이용한 이미지 데코레이션 (0) | 2008.11.13 |
괜찮다,자료 꽤 있다, 싶은 css/html 관련홈페이지 (0) | 2008.11.09 |
오페라 브라우저 무설치 버전 (0) | 2008.11.09 |
XHTML 일반 문법 준수 (0) | 2008.11.09 |
XHTML 이란 무엇인가? (0) | 2008.11.09 |
RSS란 무엇인가. (초보용) (0) | 2008.11.09 |
RECENT COMMENT