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


 
버턴관련테그
 


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



▶ [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>

실행해보기   (실행2)





 댓글 (0)


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


   label 태그9105
     [RE] Label 태그를 Image로 하기7021
   Select 꾸미기 optgroup 사용(홈마스타)7028
   체크박스라디오버튼체크유무검사.html(홈마스타)7899
   input type="file" 의 value값(홈마스타)7013
     [RE] input type=\(홈마스타)6834
     [RE] input type=\(홈마스타)6852
   input 버턴의 모양(홈마스타)6777
   중보입력 방지 루틴(홈마스타)8309
   파일업로드 버턴을 이미지로(홈마스타)378
     [RE] [JavaScript] input type(홈마스타)323
       [RE] [JavaScript] input typ(홈마스타)328
   버터느 글상자 꾸미기(홈마스타)357
   체크박스가 하나이상 체크 되었는지 검사하는 루틴(홈마스타)331
   셀렉트박스 보이는 리스트 갯수 조정(홈마스타)326
   파일 업로드 버턴을 이미지로 만들기(홈마스타)332
     [RE] 파일 업로드 버턴을 텍스트로 만들기(홈마스타)427
       [RE] 파일 업로드 버턴을 텍스트로 만들기(홈마스타)325
     [RE] 파일 업로드 버턴을 이미지로 만들기-다른 (홈마스타)322
INPUT 을 다양하게 표현하기(홈마스타)335
   버튼에 링크걸기(홈마스타)340
   버턴크기 모양 색상 변경(홈마스타)353
   버턴 모양 부드럽게 - style 사용(홈마스타)(1) 306
   버턴 태그 관련 팁(홈마스타)(2) 289
   폼 전송 버턴(홈마스타)381
[1]  

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




최근 글
[손님]

인기 글
[손님]