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



 
버턴관련테그
  


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



▶ [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 태그 9335
   △  [RE] Label 태그를 Image로 하기 7184
   △Select 꾸미기 optgroup 사용(홈마스타) 7167
   △체크박스라디오버튼체크유무검사.html(홈마스타) 8061
   △input type="file" 의 value값(홈마스타) 7200
   △  [RE] input type=\(홈마스타) 7023
   △  [RE] input type=\(홈마스타) 7040
   △input 버턴의 모양(홈마스타) 6944
   △중보입력 방지 루틴(홈마스타) 8444
   △파일업로드 버턴을 이미지로(홈마스타) 413
   △  [RE] [JavaScript] input type(홈마스타) 362
   △    [RE] [JavaScript] input typ(홈마스타) 361
   △버터느 글상자 꾸미기(홈마스타) 395
   △체크박스가 하나이상 체크 되었는지 검사하는 루틴(홈마스타) 384
   △셀렉트박스 보이는 리스트 갯수 조정(홈마스타) 362
   △파일 업로드 버턴을 이미지로 만들기(홈마스타) 364
   △  [RE] 파일 업로드 버턴을 텍스트로 만들기(홈마스타) 487
   △    [RE] 파일 업로드 버턴을 텍스트로 만들기(홈마스타) 364
   △  [RE] 파일 업로드 버턴을 이미지로 만들기-다른 (홈마스타) 353
△INPUT 을 다양하게 표현하기(홈마스타) 384
   △버튼에 링크걸기(홈마스타) 449
   △버턴크기 모양 색상 변경(홈마스타) 416
   △버턴 모양 부드럽게 - style 사용(홈마스타)(1) 340
   △버턴 태그 관련 팁(홈마스타)(2) 334
   △폼 전송 버턴(홈마스타) 425
[1]  

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



 
최근 글
△[손님]

인기 글
△[손님]
△[홈마스타] input 버턴의 모양
△[홈마스타] 실습-테이블구조변경
△[홈마스타] setinterval 사용과 중지