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



 
버턴관련테그
  


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



▶ [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 태그9192
   △  [RE] Label 태그를 Image로 하기7101
   △Select 꾸미기 optgroup 사용(홈마스타)7080
   △체크박스라디오버튼체크유무검사.html(홈마스타)7956
   △input type="file" 의 value값(홈마스타)7059
   △  [RE] input type=\(홈마스타)6882
   △  [RE] input type=\(홈마스타)6893
   △input 버턴의 모양(홈마스타)6853
   △중보입력 방지 루틴(홈마스타)8357
   △파일업로드 버턴을 이미지로(홈마스타)384
   △  [RE] [JavaScript] input type(홈마스타)332
   △    [RE] [JavaScript] input typ(홈마스타)339
   △버터느 글상자 꾸미기(홈마스타)369
   △체크박스가 하나이상 체크 되었는지 검사하는 루틴(홈마스타)342
   △셀렉트박스 보이는 리스트 갯수 조정(홈마스타)335
   △파일 업로드 버턴을 이미지로 만들기(홈마스타)338
   △  [RE] 파일 업로드 버턴을 텍스트로 만들기(홈마스타)458
   △    [RE] 파일 업로드 버턴을 텍스트로 만들기(홈마스타)336
   △  [RE] 파일 업로드 버턴을 이미지로 만들기-다른 (홈마스타)331
△INPUT 을 다양하게 표현하기(홈마스타)351
   △버튼에 링크걸기(홈마스타)353
   △버턴크기 모양 색상 변경(홈마스타)387
   △버턴 모양 부드럽게 - style 사용(홈마스타)(1) 316
   △버턴 태그 관련 팁(홈마스타)(2) 297
   △폼 전송 버턴(홈마스타)392
[1]  

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




 
최근 글
[손님]

인기 글
[손님]
△[홈마스타] [RE] input type=\\
△[기무진선] 모의고사질문이요