• 돌아가기
  • 아래로
  • 위로
  • 목록
  • 댓글
Script

글자만으로 입체버튼 만들기

오작교 22882

0
<head>에
<style type="text/css">

a:visited {text-decoration:none; color:white;}
a:link {text-decoration:none; color:white;}
a:hover {text-decoration:none; color:white;}


.first {border:1 solid #D76704; color:white;text-align:center;padding:2 0 0 2}


.over {border-style:solid; border-width:1;
border-color:#E89B57 #B15604 #B15604 #E89B57;
color:white; text-align:center;padding:2 0 0 2}


.down {border-width:1; border-style:solid;
border-color:#B15604 #E89B57 #E89B57 #B15604;
color:white; text-align:center; padding:2 0 0 2}

</style>

***
first : 처음 띄었을때 모양
over : 마우스가 올라갔을때 모양
down : 마우스를 눌렀을때 모양

border-color:#B15604 #E89B57 #E89B57 #B15604;
상(위쪽),우(오른쪽),하(아래쪽),좌(왼쪽)  색상
"상,좌" 를 같게 하고 바탕보다 밝은색을 지정,
"우,하" 를 같게 하고 바탕보다 어두은 색을 지정하면 볼록한 느낌.

<body>에 삽입방법.
<body bgcolor=#D76704>
<table width="120" height="20" cellpadding="0" cellspacing="0">
<tr>
<td class="first"
onMouseOver="this.className='over'"
onMouseOut="this.className='first'"
onMouseDown="this.className='down'"
onMouseUp="this.className='over'">
<font style="font-size:9pt;color:white">이곳에 글자</font>
</td>
</tr>
</table>

***
onMouseOver : 마우스가 올라갔을때
onMouseOut: 마우스가 내려갔을때
onMouseDown : 마우스를 눌렀을때
onMouseUp : 마우스를 눌렀다가 떼었을때
공유
0

댓글 쓰기 권한이 없습니다. 로그인

취소 댓글 등록

신고

"님의 댓글"

이 댓글을 신고하시겠습니까?

댓글 삭제

"님의 댓글"

삭제하시겠습니까?

목록

공유

facebooktwitterpinterestbandkakao story
번호 분류 제목 글쓴이 날짜 조회 추천
공지 HTML HTML 기초 다지기 4 오작교 08.06.17.16:26 290779 0
공지 HTML HTML과 CSS의 종합 정리 1 오작교 07.10.01.10:21 349736 0
공지 일반 스타일시트의 총정리 오작교 06.09.14.13:08 294375 +14
87 Script
normal
오작교 23.12.10.09:29 19853 0
86 Script
normal
오작교 15.05.12.14:06 21221 0
85 Script
normal
오작교 11.03.22.11:19 43522 0
84 Script
normal
오작교 11.03.22.11:15 38294 0
83 Script
normal
오작교 11.03.22.11:07 37179 0
82 Script
normal
오작교 11.01.24.10:34 38173 0
81 Script
normal
오작교 10.04.10.21:43 44207 0
80 Script
normal
오작교 09.04.14.15:52 21479 0
79 Script
normal
오작교 09.02.26.19:30 44445 0
78 Script
normal
오작교 09.02.03.16:06 29987 0
77 Script
normal
오작교 09.02.03.16:05 30079 0
76 Script
normal
오작교 08.08.08.11:58 30901 0
75 Script
normal
오작교 08.07.08.09:23 24013 0
74 Script
normal
오작교 08.01.08.13:26 36979 0
73 Script
normal
오작교 08.01.07.13:00 40789 0
72 Script
normal
오작교 08.01.07.12:52 23835 0
71 Script
normal
오작교 07.10.23.17:18 38405 0
70 Script
normal
오작교 07.10.23.17:16 29208 0
69 Script
normal
오작교 07.10.23.17:14 28232 0
68 Script
normal
오작교 07.10.23.17:08 27648 0