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

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

오작교 22888

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 291002 0
공지 HTML HTML과 CSS의 종합 정리 1 오작교 07.10.01.10:21 349960 0
공지 일반 스타일시트의 총정리 오작교 06.09.14.13:08 294602 +14
300
normal
오작교 23.12.10.09:32 14550 0
299 Script
normal
오작교 23.12.10.09:29 19891 0
298 CSS
normal
오작교 21.01.09.14:18 40831 0
297 HTML
normal
오작교 15.09.17.08:58 116418 0
296 HTML
normal
오작교 15.09.13.21:38 21686 0
295 HTML
normal
오작교 15.09.13.21:30 25272 0
294 HTML
normal
오작교 15.08.30.12:19 52874 0
293 Script
normal
오작교 15.05.12.14:06 21262 0
292 HTML
file
오작교 12.03.08.13:51 36027 0
291 HTML
normal
오작교 11.06.03.10:44 40851 0
290 CSS
normal
오작교 11.06.03.10:29 70756 0
289 Script
normal
오작교 11.03.22.11:19 43558 0
288 Script
normal
오작교 11.03.22.11:15 38327 0
287 Script
normal
오작교 11.03.22.11:07 37212 0
286 HTML
normal
오작교 11.01.25.10:27 36310 0
285 CSS
normal
오작교 11.01.24.10:40 35483 0
284 HTML
normal
오작교 11.01.24.10:39 37194 0
283 Script
normal
오작교 11.01.24.10:34 38205 0
282 CSS
normal
오작교 11.01.24.10:31 37842 0
281 CSS
normal
오작교 11.01.24.10:27 36314 0