웹모아
웹모아[가입] 로그인 / 회원가입   검색     


  
버턴관련테그
  

▽INPUT 을 다양하게 표현하기
2006-03-29 01:26:04 댓글:(0)   조회:1849
 

▶ [TYPE="text"]의 테두리를 선으로 표현하기
<html>
<head>
<title>..</title> 
</head>
<body>
<input type="text" maxlength="8" size="20" name="motifdn"
style="BORDER-RIGHT: black 1px solid; BORDER-TOP: black 1px solid;
BORDER-LEFT: black 1px solid; BORDER-BOTTOM: black 1px solid;
FONT-FAMILY: gulim; FONT-SIZE: 9pt;HEIGHT:16px;">
</body>
</html> 


▶ [TYPE="text"]의 테두리 점선으로 표현하기   <html>
<head>
<title>..</title> 
</head>
<body>
<input type="text" maxlength="30" name="motifdn" size="20"
style="BORDER-BOTTOM: 1px dashed; BORDER-LEFT: 1px dashed;
BORDER-RIGHT: 1px dashed; BORDER-TOP: 1px dashed">
</body>
</html> 


▶ [TYPE="text"]의 테두리 밑선으로 표현하기
<html>
<head>
<title>..</title> 
</head>
<body>
<input type="text" name="motifdn" size="20"
Style = "BORDER-BOTTOM: #333333 1px solid; BORDER-LEFT: #ffffff 1px solid; 
BORDER-RIGHT: #ffffff 1px solid; BORDER-TOP: #ffffff 1px solid">
</body>
</html> 


▶ [TYPE="text"]의 배경색 바꾸고 마우스오버시 색바꾸기
<html>
<head>
<title>..</title> 
</head>
<body>
<input type="text" name="motifdn" size="20" style="BACKGROUND-COLOR: #999999"
onMouseOver = "this.style.backgroundColor = 'gold'"
onMouseOut = "this.style.backgroundColor = '#999999'">
</body>
</html> 


▶ [TYPE="button"]의 테두리를 선으로 표현하기
<html>
<head>
<title>..</title> 
</head>
<body> 
<input type="button" name="mybn" value="ok" 
style="width:50;height:18;background-color:#d0d0d0;border:1 solid #999999;color:silver"> 
</body>
</html> 


▶ [TYPE="button"]에 배경이미지 넣기 <html>
<head>
<title>..</title> 
</head>
<body>
<input type="button" 
STYLE="width:100; height:25; cursor:hand; background:url(이미지파일); color:black;font-weight:bold"> 
</body>
</html> 


▶ [TYPE="button"]에 마우스오버시 색바꾸기 <html>
<head>
<title>..</title> 
</head>
<body>
<input type="button" name="mybn" value="ok" 
onMouseOver = "this.style.backgroundColor = 'white'"
onMouseOut = "this.style.backgroundColor = ''">
</body>
</html> 


▶ select의 옵션 전체 배경색 표현하기 <html>
<head>
<title>..</title> 
</head>
<body>
<select style="background#B9FD6F;>
<option value="1">선택1</option>
<option value="2">선택2</option>
<option value="3">선택3</option>
</select>
</body>
</html> 


▶ select의 옵션 한줄씩 교대로 배경색 바꿔서 표현하기 <html>
<head>
<title>..</title> 
</head>
<body>
<Select >
<option value="1" style="background-color: #B9FD6F">선택1</option>
<option value="2">선택2</option>
<option value="3" style="background-color: #B9FD6F">선택3</option>
<option value="4">선택4</option>
<option value="5" style="background-color: #B9FD6F">선택5</option>
</Select>
</body>
</html> 


▶ select의 옵션 전부 다른색으로 표현하기 <html>
<head>
<title>..</title> 
</head>
<body>
<Select style="font-size:8pt">
<option value="1" style="background:navy;color:white">선택1</option>
<option value="2" style="background:yellow;color:black">선택2</option>
<option value="3" style="background:red;color:white">선택3</option>
<option value="4" style="background:navy;color:white">선택4</option>
</Select>
</body>
</html> 


▶ TextArea을 라인선 없이 배경색으로 표현하기 <html>
<head>
<title>..</title> 
</head>
<body>
<TEXTAREA rows=10 cols=60 style="background-color:#B9FD6F;border-width:0;" >
내용</TEXTAREA>
</body>
</html> 


▶ TextArea을 배경이미지으로 표현하기 <html>
<head>
<title>..</title> 
</head>
<body>
<TEXTAREA style="background-image:url(이미지파일); 
background-repeat:no-repeat; background-attachment:fixed;" rows=10 cols=60> 
내용</TEXTAREA>
</body>
</html>
. 

[이전글] ▽ 파일 업로드 버턴을 이미지로 만들기
[다음글] ▽ 버튼에 링크걸기


 
※ 댓글쓰기는 회원(로그인 하신분) 이상 가능합니다.


 댓글 (0)

  
버턴관련테그
 페이지: 1 / 3   

▽ label 태그
열람:13176   2009.02.15 		
▽   [RE] Label 태그를 Image로 하기
열람:10445   2009.02.15 		
▽ Select 꾸미기 optgroup 사용
(홈마스타) 열람:9823   2007.06.10 		
▽ 체크박스라디오버튼체크유무검사.html
(홈마스타) 열람:10965   2007.05.30 		
▽ input type="file" 의 value값 초기화 시키기
(홈마스타) 열람:10989   2006.12.30 		
▽   [RE] input type=\
(홈마스타) 열람:11483   2006.12.30 		
▽   [RE] input type=\
(홈마스타) 열람:10590   2006.12.30 		
▽ input 버턴의 모양
(홈마스타) 열람:8999   2006.12.21 		
▽ 중보입력 방지 루틴
(홈마스타) 열람:10377   2006.09.05 		
▽ 파일업로드 버턴을 이미지로
(홈마스타) 열람:2298   2006.08.05 		

[1]  [2]  [3]   ≫

복수단어 검색은 공백(space)로 구분해 주세요.




 
최근 글 ▽[손님]
 
인기 글 ▽[손님]
▽[밝곰] 출첵입니다
▽[홈마스타] [RE] input type=\\
▽[홈마스타] 실습-테이블구조변경