http://www.mungchung.com/xe/?mid=spread&listStyle=webzine&document_srl=2818&sort_index=readed_count&order_type=desc
참고해서 하자..
9/17/2010
9/16/2010
input css style
출처 : http://inusme.com/entry/HTML-input%EC%8A%A4%ED%83%80%EC%9D%BC
고맙습니다 ~~
<INPUTstyle="BORDER-RIGHT: #666666 1px solid; BORDER-TOP: #666666 1px solid;BORDER-LEFT: #666666 1px solid; WIDTH: 150px; BORDER-BOTTOM: #6666661px solid">
style="border: 1px solid #666666;"
<INPUTstyle="BORDER-RIGHT: #666666 1px solid; BORDER-TOP: #666666 1px solid;BORDER-LEFT: #666666 1px solid; WIDTH: 150px; BORDER-BOTTOM: #6666661px solid; BACKGROUND-COLOR: #f8f8f8">
style="background-color:#f8f8f8;border: 1px solid #666666;"
<INPUTstyle="BORDER-RIGHT: #666666 1px solid; BORDER-TOP: #898989 1px solid;BORDER-LEFT: #898989 1px solid; WIDTH: 150px; COLOR: #666666;BORDER-BOTTOM: #666666 1px solid; BACKGROUND-COLOR: #f8f8f8">
style="background-color:#f8f8f8;border-top: 1px solid #898989; border-bottom: 1px solid #666666;border-left: 1px solid #898989; border-right: 1px solid #666666;
<INPUTstyle="BORDER-RIGHT: 0px; BORDER-TOP: 0px; BORDER-LEFT: 0px; WIDTH:150px; COLOR: #666666; BORDER-BOTTOM: #666666 1px solid;BACKGROUND-COLOR: #f9f9f9">
style="background-color:#f9f9f9; border-top: 0px; border-bottom: 1px solid #666666; border-left: 0px; border-right:0px;
< 예> <INPUT style="BORDER-RIGHT: 0px; BORDER-TOP: #666666 1pxsolid; BORDER-LEFT: #666666 1px solid; WIDTH: 100px; COLOR: #666666;BORDER-BOTTOM: #666666 1px solid; BACKGROUND-COLOR: #f9f9f9"> <INPUT style="BORDER-RIGHT: 0px; BORDER-TOP: #666666 1px solid;BORDER-LEFT: 0px; WIDTH: 100px; COLOR: #666666; BORDER-BOTTOM: #6666661px solid; BACKGROUND-COLOR: #f9f9f9"> <INPUTstyle="BORDER-RIGHT: 0px; BORDER-TOP: 0px; BORDER-LEFT: 0px; WIDTH:100px; COLOR: #666666; BORDER-BOTTOM: #666666 2px solid;BACKGROUND-COLOR: #f9f9f9">
<INPUTstyle="BORDER-RIGHT: #666666 1px dotted; BORDER-TOP: #666666 1pxdotted; BORDER-LEFT: #666666 1px dotted; WIDTH: 150px; COLOR: #666666;BORDER-BOTTOM: #666666 1px dotted; BACKGROUND-COLOR: #ffffff"> style="border: 1px dotted #666666;"
<INPUTstyle="BORDER-RIGHT: #666666 2px dotted; BORDER-TOP: #666666 2pxdotted; BORDER-LEFT: #666666 2px dotted; WIDTH: 150px; COLOR: #666666;BORDER-BOTTOM: #666666 2px dotted; BACKGROUND-COLOR: #ffffff"> style="border: 2px dotted #666666;"
<INPUTstyle="BORDER-RIGHT: #666666 5px dotted; BORDER-TOP: #666666 5pxdotted; BORDER-LEFT: #666666 5px dotted; WIDTH: 150px; COLOR: #666666;BORDER-BOTTOM: #666666 5px dotted; BACKGROUND-COLOR: #ffffff"> style="border: 5px dotted #666666;"
<INPUTstyle="BORDER-RIGHT: #666666 1px dashed; BORDER-TOP: #666666 1pxdashed; BORDER-LEFT: #666666 1px dashed; WIDTH: 150px; COLOR: #666666;BORDER-BOTTOM: #666666 1px dashed; BACKGROUND-COLOR: #ffffff"> style="border: 1px dashed#666666;"
<INPUTstyle="BORDER-RIGHT: #666666 2px dashed; BORDER-TOP: #666666 2pxdashed; BORDER-LEFT: #666666 2px dashed; WIDTH: 150px; COLOR: #666666;BORDER-BOTTOM: #666666 2px dashed; BACKGROUND-COLOR: #ffffff"> style="border: 2px dashed #666666;"
<INPUTstyle="BORDER-RIGHT: #666666 3px dashed; BORDER-TOP: #666666 3pxdashed; BORDER-LEFT: #666666 3px dashed; WIDTH: 150px; COLOR: #666666;BORDER-BOTTOM: #666666 3px dashed; BACKGROUND-COLOR: #ffffff"> style="border: 3px dashed #666666;"
<INPUTstyle="BORDER-RIGHT: #666666 3px double; BORDER-TOP: #666666 3pxdouble; BORDER-LEFT: #666666 3px double; WIDTH: 150px; COLOR: #666666;BORDER-BOTTOM: #666666 3px double; BACKGROUND-COLOR: #ffffff"> style="border: 3px double #646464;"(두께가 3이상이여야 효과가 나타남)
<INPUTstyle="BORDER-RIGHT: #eeeeee 3px ridge; BORDER-TOP: #eeeeee 3px ridge;BORDER-LEFT: #eeeeee 3px ridge; WIDTH: 150px; COLOR: #666666;BORDER-BOTTOM: #eeeeee 3px ridge; BACKGROUND-COLOR: #ffffff"> style="border:3px ridge #eeeeee;"
<INPUTstyle="BORDER-RIGHT: #eeeeee 3px groove; BORDER-TOP: #eeeeee 3pxgroove; BORDER-LEFT: #eeeeee 3px groove; WIDTH: 150px; COLOR: #666666;BORDER-BOTTOM: #eeeeee 3px groove; BACKGROUND-COLOR: #ffffff"> style="border:3px groove #eeeeee;"
<INPUTstyle="BORDER-RIGHT: #eeeeee 3px inset; BORDER-TOP: #eeeeee 3px inset;BORDER-LEFT: #eeeeee 3px inset; WIDTH: 150px; COLOR: #666666;BORDER-BOTTOM: #eeeeee 3px inset; BACKGROUND-COLOR: #ffffff"> style="border:3px inset #eeeeee;"
<INPUTstyle="BORDER-RIGHT: #eeeeee 3px outset; BORDER-TOP: #eeeeee 3pxoutset; BORDER-LEFT: #eeeeee 3px outset; WIDTH: 150px; COLOR: #666666;BORDER-BOTTOM: #eeeeee 3px outset; BACKGROUND-COLOR: #ffffff"> style="border:3px outset #eeeeee;"
<INPUTstyle="BORDER-RIGHT: #666666 1px solid; BORDER-TOP: #666666 1px solid;BORDER-LEFT: #666666 1px solid; WIDTH: 150px; COLOR: #666666;BORDER-BOTTOM: #666666 1px solid"onmouseout="this.style.backgroundColor='#ffffff'" name=user_id>
onmouseover="this.style.backgroundColor='353535'" onmouseout="this.style.backgroundColor='#ffffff'"
* onmouseover="this.style.backgroundColor='색상'" 마우스오버시 색지정
* onmouseout="this.style.backgroundColor='색상'" 마우스아웃시 색지정
<INPUTstyle="BORDER-RIGHT: #666666 1px solid; BORDER-TOP: #666666 1px solid;BORDER-LEFT: #666666 1px solid; WIDTH: 150px; COLOR: #666666;BORDER-BOTTOM: #666666 1px solid; BACKGROUND-COLOR: transparent"onmouseout="this.style.backgroundColor='transparent'" name=user_id>
onmouseover="this.style.backgroundColor='353535'"onmouseout="this.style.backgroundColor='transparent'"style="background-color:transparent;"
* transparent 배경색을 투명으로 지정
<INPUTonblur="this.style.background='ffffff'" style="WIDTH: 150px; COLOR:#ffffff" onfocus="this.style.background='353535'" name="" ?>
onfocus="this.style.background='353535'" onblur="this.style.background='ffffff'"
* onfocus 개체에 포커스가 생기는 순간발생
* onblur 개체에 포커스가 사라지는 순간발생
<INPUT style="BORDER-RIGHT: 0px; BORDER-TOP: 0px; BACKGROUND-IMAGE:
url(http://static.naver.com/n/cmn/ico_new07.gif); BORDER-LEFT: 0px; WIDTH: 150px; COLOR: #000000;BORDER-BOTTOM: 0px">
style="background-image:url('이미지');border: 0px;color:000000;"
button에 배경이미지 넣기<INPUT style="BORDER-RIGHT: 0px; BORDER-TOP: 0px; FONT-WEIGHT: bold;BACKGROUND:url(http://blogimgs.naver.com/imgs/section/btn_mybloggo.gif);BORDER-LEFT: 0px;WIDTH:151px;CURSOR:hand;COLOR:#ffffff;BORDER-BOTTOM:0px;HEIGHT:39px"type=button>
STYLE="width:151;height:39;cursor:hand;background:url('http://blogimgs.naver.com/imgs/section/btn_mybloggo.gif');border:0;color:ffffff;font-weight:bold"
테두리 있는 button<INPUT style="BORDER-RIGHT: #000000 1px solid; BORDER-TOP: #0000001px solid; FONT-WEIGHT: bold; BORDER-LEFT: #000000 1px solid; WIDTH:80px; CURSOR: hand; COLOR: #f8f8f8; PADDING-TOP: 2px; BORDER-BOTTOM:#000000 1px solid; HEIGHT: 20px; BACKGROUND-COLOR: #5b5b5b" type=buttonvalue=BUTTON name=mybn>
STYLE="width:80;height:20;padding-top:2px;cursor:hand;background-color:#5B5B5B;border:1 solid#000000;; color:F8F8F8;font-weight:bold"
마우스 오버시 button 색변경<INPUT style="BORDER-RIGHT: #353535 1px solid; BORDER-TOP: #3535351px solid; FONT-WEIGHT: bold; BORDER-LEFT: #353535 1px solid; WIDTH:80px; CURSOR: hand; COLOR: #f8f8f8; PADDING-TOP: 2px; BORDER-BOTTOM:#353535 1px solid; HEIGHT: 20px; BACKGROUND-COLOR: #333333"onmouseout="this.style.backgroundColor = '333333'" type=buttonvalue=BUTTON name=mybn>
STYLE="width:80;height:20;padding-top:2px;cursor:hand;background-color:#333333;border:1 solid#353535;; color:F8F8F8;font-weight:bold" onMouseOver ="this.style.backgroundColor = 'ff0000'" onMouseOut ="this.style.backgroundColor = '333333'"
<TEXTAREAstyle="BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px;BORDER-BOTTOM-WIDTH: 0px; FONT: 11px verdana; OVERFLOW: visible; WIDTH:100%; COLOR: #666666; PADDING-TOP: 5px; LETTER-SPACING: -0.1em;TEXT-OVERFLOW: ellipsis; BACKGROUND-COLOR: transparent;BORDER-RIGHT-WIDTH: 0px" readOnly><selectstyle="background:#353535;color:666666;"> <optionvalue="1">선택1</option> <optionvalue="2">선택2</option> <optionvalue="3">선택3</option> </select> </TEXTAREA>
<TEXTAREAstyle="BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px;BORDER-BOTTOM-WIDTH: 0px; FONT: 11px verdana; OVERFLOW: visible; WIDTH:100%; COLOR: #666666; PADDING-TOP: 5px; LETTER-SPACING: -0.1em;TEXT-OVERFLOW: ellipsis; BACKGROUND-COLOR: transparent;BORDER-RIGHT-WIDTH: 0px" readOnly><Select > <optionvalue="1">선택1</option> <option value="2"style="background-color: #f0f0f0">선택2</option> <optionvalue="3">선택3</option> <option value="4"style="background-color: #dddddd">선택4</option> <optionvalue="5">선택5</option> </Select> </TEXTAREA>
<TEXTAREA style="BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px;BORDER-BOTTOM-WIDTH: 0px; FONT: 11px verdana; OVERFLOW: visible; WIDTH:100%; COLOR: #666666; PADDING-TOP: 5px; LETTER-SPACING: -0.1em;TEXT-OVERFLOW: ellipsis; BACKGROUND-COLOR: transparent;BORDER-RIGHT-WIDTH: 0px" readOnly><Selectstyle="font-size:8pt"> <option value="1"style="color:353535">선택1</option> <option value="2"style="background:eeeeee;color:000000">선택2</option> <optionvalue="3" style="background:aaaaaa;color:f8f8f8">선택3</option><option value="4"style="background:353535;color:ffffff">선택4</option>& lt;/Select> </TEXTAREA>
[textarea 스크롤바색상바꾸기]
<TEXTAREAstyle="SCROLLBAR-FACE-COLOR: #353535; SCROLLBAR-SHADOW-COLOR: #353535;SCROLLBAR-ARROW-COLOR: #dddddd; SCROLLBAR-BASE-COLOR: #000000" rows=5cols=60> </TEXTAREA>
style="scrollbar-base-color:#000000;scrollbar-shadow-color:#353535;scrollbar-arrow-color: #dddddd;scrollbar-face-color: #353535;"
[textarea 라인없이 표현하기]
<TEXTAREAstyle="BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px;BORDER-BOTTOM-WIDTH: 0px; COLOR: #ffffff; BACKGROUND-COLOR: #f8f8f8;BORDER-RIGHT-WIDTH: 0px" rows=5 cols=60></TEXTAREA>
style="background-color:#f8f8f8;border-width:0;color:ffffff;"
[textarea 안에 배경이미지 넣기]
[textarea 스크롤바 안생기게 하기]
<TEXTAREA style="OVERFLOW: hidden" rows=5 cols=60></TEXTAREA>
style="overflow:hidden" (필요시에만 생기게 하려면 overflow:auto)
[textarea width,height 설정하기]
<TEXTAREA style="WIDTH: 100%; HEIGHT: 50px"></TEXTAREA>
style="width:100%;height:50px;"
[textarea 한/영키를 누루지 않고 한글/영어 언어선택]
<TEXTAREAstyle="IME-MODE: inactive" rows=5 cols=30 ]>영어</TEXTAREA><TEXTAREA style="IME-MODE: active" rows=5cols=30>한글</TEXTAREA>
* style="ime-mode:inactive;"(영어)
* style="ime-mode:active;"(한글)
[textarea내의 내용 자동선택]
<TEXTAREA onfocus="this.select()" rows="5" cols="60">textarea내의 내용 자동선택</TEXTAREA>
onMouseOver="this.focus()" onFocus="this.select()"
[textarea 자동으로 늘리기]
<TEXTAREAstyle="BORDER-RIGHT: #666666 1px solid; BORDER-TOP: #666666 1px solid;OVERFLOW: visible; BORDER-LEFT: #666666 1px solid; WIDTH: 100%;BORDER-BOTTOM: #666666 1px solid; HEIGHT: 50px; TEXT-OVERFLOW:ellipsis" name=memo> </TEXTAREA>style="width:100%;height:50;border:1 solid#333333;overflow:visible;text-overflow:ellipsis;"
고맙습니다 ~~
<INPUTstyle="BORDER-RIGHT: #666666 1px solid; BORDER-TOP: #666666 1px solid;BORDER-LEFT: #666666 1px solid; WIDTH: 150px; BORDER-BOTTOM: #6666661px solid">
style="border: 1px solid #666666;"
<INPUTstyle="BORDER-RIGHT: #666666 1px solid; BORDER-TOP: #666666 1px solid;BORDER-LEFT: #666666 1px solid; WIDTH: 150px; BORDER-BOTTOM: #6666661px solid; BACKGROUND-COLOR: #f8f8f8">
style="background-color:#f8f8f8;border: 1px solid #666666;"
<INPUTstyle="BORDER-RIGHT: #666666 1px solid; BORDER-TOP: #898989 1px solid;BORDER-LEFT: #898989 1px solid; WIDTH: 150px; COLOR: #666666;BORDER-BOTTOM: #666666 1px solid; BACKGROUND-COLOR: #f8f8f8">
style="background-color:#f8f8f8;border-top: 1px solid #898989; border-bottom: 1px solid #666666;border-left: 1px solid #898989; border-right: 1px solid #666666;
<INPUTstyle="BORDER-RIGHT: 0px; BORDER-TOP: 0px; BORDER-LEFT: 0px; WIDTH:150px; COLOR: #666666; BORDER-BOTTOM: #666666 1px solid;BACKGROUND-COLOR: #f9f9f9">
style="background-color:#f9f9f9; border-top: 0px; border-bottom: 1px solid #666666; border-left: 0px; border-right:0px;
< 예> <INPUT style="BORDER-RIGHT: 0px; BORDER-TOP: #666666 1pxsolid; BORDER-LEFT: #666666 1px solid; WIDTH: 100px; COLOR: #666666;BORDER-BOTTOM: #666666 1px solid; BACKGROUND-COLOR: #f9f9f9"> <INPUT style="BORDER-RIGHT: 0px; BORDER-TOP: #666666 1px solid;BORDER-LEFT: 0px; WIDTH: 100px; COLOR: #666666; BORDER-BOTTOM: #6666661px solid; BACKGROUND-COLOR: #f9f9f9"> <INPUTstyle="BORDER-RIGHT: 0px; BORDER-TOP: 0px; BORDER-LEFT: 0px; WIDTH:100px; COLOR: #666666; BORDER-BOTTOM: #666666 2px solid;BACKGROUND-COLOR: #f9f9f9">
<INPUTstyle="BORDER-RIGHT: #666666 1px dotted; BORDER-TOP: #666666 1pxdotted; BORDER-LEFT: #666666 1px dotted; WIDTH: 150px; COLOR: #666666;BORDER-BOTTOM: #666666 1px dotted; BACKGROUND-COLOR: #ffffff"> style="border: 1px dotted #666666;"
<INPUTstyle="BORDER-RIGHT: #666666 2px dotted; BORDER-TOP: #666666 2pxdotted; BORDER-LEFT: #666666 2px dotted; WIDTH: 150px; COLOR: #666666;BORDER-BOTTOM: #666666 2px dotted; BACKGROUND-COLOR: #ffffff"> style="border: 2px dotted #666666;"
<INPUTstyle="BORDER-RIGHT: #666666 5px dotted; BORDER-TOP: #666666 5pxdotted; BORDER-LEFT: #666666 5px dotted; WIDTH: 150px; COLOR: #666666;BORDER-BOTTOM: #666666 5px dotted; BACKGROUND-COLOR: #ffffff"> style="border: 5px dotted #666666;"
<INPUTstyle="BORDER-RIGHT: #666666 1px dashed; BORDER-TOP: #666666 1pxdashed; BORDER-LEFT: #666666 1px dashed; WIDTH: 150px; COLOR: #666666;BORDER-BOTTOM: #666666 1px dashed; BACKGROUND-COLOR: #ffffff"> style="border: 1px dashed#666666;"
<INPUTstyle="BORDER-RIGHT: #666666 2px dashed; BORDER-TOP: #666666 2pxdashed; BORDER-LEFT: #666666 2px dashed; WIDTH: 150px; COLOR: #666666;BORDER-BOTTOM: #666666 2px dashed; BACKGROUND-COLOR: #ffffff"> style="border: 2px dashed #666666;"
<INPUTstyle="BORDER-RIGHT: #666666 3px dashed; BORDER-TOP: #666666 3pxdashed; BORDER-LEFT: #666666 3px dashed; WIDTH: 150px; COLOR: #666666;BORDER-BOTTOM: #666666 3px dashed; BACKGROUND-COLOR: #ffffff"> style="border: 3px dashed #666666;"
<INPUTstyle="BORDER-RIGHT: #666666 3px double; BORDER-TOP: #666666 3pxdouble; BORDER-LEFT: #666666 3px double; WIDTH: 150px; COLOR: #666666;BORDER-BOTTOM: #666666 3px double; BACKGROUND-COLOR: #ffffff"> style="border: 3px double #646464;"(두께가 3이상이여야 효과가 나타남)
<INPUTstyle="BORDER-RIGHT: #eeeeee 3px ridge; BORDER-TOP: #eeeeee 3px ridge;BORDER-LEFT: #eeeeee 3px ridge; WIDTH: 150px; COLOR: #666666;BORDER-BOTTOM: #eeeeee 3px ridge; BACKGROUND-COLOR: #ffffff"> style="border:3px ridge #eeeeee;"
<INPUTstyle="BORDER-RIGHT: #eeeeee 3px groove; BORDER-TOP: #eeeeee 3pxgroove; BORDER-LEFT: #eeeeee 3px groove; WIDTH: 150px; COLOR: #666666;BORDER-BOTTOM: #eeeeee 3px groove; BACKGROUND-COLOR: #ffffff"> style="border:3px groove #eeeeee;"
<INPUTstyle="BORDER-RIGHT: #eeeeee 3px inset; BORDER-TOP: #eeeeee 3px inset;BORDER-LEFT: #eeeeee 3px inset; WIDTH: 150px; COLOR: #666666;BORDER-BOTTOM: #eeeeee 3px inset; BACKGROUND-COLOR: #ffffff"> style="border:3px inset #eeeeee;"
<INPUTstyle="BORDER-RIGHT: #eeeeee 3px outset; BORDER-TOP: #eeeeee 3pxoutset; BORDER-LEFT: #eeeeee 3px outset; WIDTH: 150px; COLOR: #666666;BORDER-BOTTOM: #eeeeee 3px outset; BACKGROUND-COLOR: #ffffff"> style="border:3px outset #eeeeee;"
<INPUTstyle="BORDER-RIGHT: #666666 1px solid; BORDER-TOP: #666666 1px solid;BORDER-LEFT: #666666 1px solid; WIDTH: 150px; COLOR: #666666;BORDER-BOTTOM: #666666 1px solid"onmouseout="this.style.backgroundColor='#ffffff'" name=user_id>
onmouseover="this.style.backgroundColor='353535'" onmouseout="this.style.backgroundColor='#ffffff'"
* onmouseover="this.style.backgroundColor='색상'" 마우스오버시 색지정
* onmouseout="this.style.backgroundColor='색상'" 마우스아웃시 색지정
<INPUTstyle="BORDER-RIGHT: #666666 1px solid; BORDER-TOP: #666666 1px solid;BORDER-LEFT: #666666 1px solid; WIDTH: 150px; COLOR: #666666;BORDER-BOTTOM: #666666 1px solid; BACKGROUND-COLOR: transparent"onmouseout="this.style.backgroundColor='transparent'" name=user_id>
onmouseover="this.style.backgroundColor='353535'"onmouseout="this.style.backgroundColor='transparent'"style="background-color:transparent;"
* transparent 배경색을 투명으로 지정
<INPUTonblur="this.style.background='ffffff'" style="WIDTH: 150px; COLOR:#ffffff" onfocus="this.style.background='353535'" name="" ?>
onfocus="this.style.background='353535'" onblur="this.style.background='ffffff'"
* onfocus 개체에 포커스가 생기는 순간발생
* onblur 개체에 포커스가 사라지는 순간발생
<INPUT style="BORDER-RIGHT: 0px; BORDER-TOP: 0px; BACKGROUND-IMAGE:
url(http://static.naver.com/n/cmn/ico_new07.gif); BORDER-LEFT: 0px; WIDTH: 150px; COLOR: #000000;BORDER-BOTTOM: 0px">
style="background-image:url('이미지');border: 0px;color:000000;"
button에 배경이미지 넣기<INPUT style="BORDER-RIGHT: 0px; BORDER-TOP: 0px; FONT-WEIGHT: bold;BACKGROUND:url(http://blogimgs.naver.com/imgs/section/btn_mybloggo.gif);BORDER-LEFT: 0px;WIDTH:151px;CURSOR:hand;COLOR:#ffffff;BORDER-BOTTOM:0px;HEIGHT:39px"type=button>
STYLE="width:151;height:39;cursor:hand;background:url('http://blogimgs.naver.com/imgs/section/btn_mybloggo.gif');border:0;color:ffffff;font-weight:bold"
테두리 있는 button<INPUT style="BORDER-RIGHT: #000000 1px solid; BORDER-TOP: #0000001px solid; FONT-WEIGHT: bold; BORDER-LEFT: #000000 1px solid; WIDTH:80px; CURSOR: hand; COLOR: #f8f8f8; PADDING-TOP: 2px; BORDER-BOTTOM:#000000 1px solid; HEIGHT: 20px; BACKGROUND-COLOR: #5b5b5b" type=buttonvalue=BUTTON name=mybn>
STYLE="width:80;height:20;padding-top:2px;cursor:hand;background-color:#5B5B5B;border:1 solid#000000;; color:F8F8F8;font-weight:bold"
마우스 오버시 button 색변경<INPUT style="BORDER-RIGHT: #353535 1px solid; BORDER-TOP: #3535351px solid; FONT-WEIGHT: bold; BORDER-LEFT: #353535 1px solid; WIDTH:80px; CURSOR: hand; COLOR: #f8f8f8; PADDING-TOP: 2px; BORDER-BOTTOM:#353535 1px solid; HEIGHT: 20px; BACKGROUND-COLOR: #333333"onmouseout="this.style.backgroundColor = '333333'" type=buttonvalue=BUTTON name=mybn>
STYLE="width:80;height:20;padding-top:2px;cursor:hand;background-color:#333333;border:1 solid#353535;; color:F8F8F8;font-weight:bold" onMouseOver ="this.style.backgroundColor = 'ff0000'" onMouseOut ="this.style.backgroundColor = '333333'"
<TEXTAREAstyle="BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px;BORDER-BOTTOM-WIDTH: 0px; FONT: 11px verdana; OVERFLOW: visible; WIDTH:100%; COLOR: #666666; PADDING-TOP: 5px; LETTER-SPACING: -0.1em;TEXT-OVERFLOW: ellipsis; BACKGROUND-COLOR: transparent;BORDER-RIGHT-WIDTH: 0px" readOnly><selectstyle="background:#353535;color:666666;"> <optionvalue="1">선택1</option> <optionvalue="2">선택2</option> <optionvalue="3">선택3</option> </select> </TEXTAREA>
<TEXTAREAstyle="BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px;BORDER-BOTTOM-WIDTH: 0px; FONT: 11px verdana; OVERFLOW: visible; WIDTH:100%; COLOR: #666666; PADDING-TOP: 5px; LETTER-SPACING: -0.1em;TEXT-OVERFLOW: ellipsis; BACKGROUND-COLOR: transparent;BORDER-RIGHT-WIDTH: 0px" readOnly><Select > <optionvalue="1">선택1</option> <option value="2"style="background-color: #f0f0f0">선택2</option> <optionvalue="3">선택3</option> <option value="4"style="background-color: #dddddd">선택4</option> <optionvalue="5">선택5</option> </Select> </TEXTAREA>
<TEXTAREA style="BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px;BORDER-BOTTOM-WIDTH: 0px; FONT: 11px verdana; OVERFLOW: visible; WIDTH:100%; COLOR: #666666; PADDING-TOP: 5px; LETTER-SPACING: -0.1em;TEXT-OVERFLOW: ellipsis; BACKGROUND-COLOR: transparent;BORDER-RIGHT-WIDTH: 0px" readOnly><Selectstyle="font-size:8pt"> <option value="1"style="color:353535">선택1</option> <option value="2"style="background:eeeeee;color:000000">선택2</option> <optionvalue="3" style="background:aaaaaa;color:f8f8f8">선택3</option><option value="4"style="background:353535;color:ffffff">선택4</option>& lt;/Select> </TEXTAREA>
[textarea 스크롤바색상바꾸기]
<TEXTAREAstyle="SCROLLBAR-FACE-COLOR: #353535; SCROLLBAR-SHADOW-COLOR: #353535;SCROLLBAR-ARROW-COLOR: #dddddd; SCROLLBAR-BASE-COLOR: #000000" rows=5cols=60> </TEXTAREA>
style="scrollbar-base-color:#000000;scrollbar-shadow-color:#353535;scrollbar-arrow-color: #dddddd;scrollbar-face-color: #353535;"
[textarea 라인없이 표현하기]
<TEXTAREAstyle="BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px;BORDER-BOTTOM-WIDTH: 0px; COLOR: #ffffff; BACKGROUND-COLOR: #f8f8f8;BORDER-RIGHT-WIDTH: 0px" rows=5 cols=60></TEXTAREA>
style="background-color:#f8f8f8;border-width:0;color:ffffff;"
[textarea 안에 배경이미지 넣기]
<TEXTAREA style="BACKGROUND-IMAGE: url(http://blogimgs.naver.com/imgs/lg_naver01.gif)" rows=4 cols=45></TEXTAREA>
style="background-images:url('img.jpg');"
style="background-image:url('이미지'); background-repeat:no-repeat; background-position:50% 50%;" [textarea 스크롤바 안생기게 하기]
<TEXTAREA style="OVERFLOW: hidden" rows=5 cols=60></TEXTAREA>
style="overflow:hidden" (필요시에만 생기게 하려면 overflow:auto)
[textarea width,height 설정하기]
<TEXTAREA style="WIDTH: 100%; HEIGHT: 50px"></TEXTAREA>
style="width:100%;height:50px;"
[textarea 한/영키를 누루지 않고 한글/영어 언어선택]
<TEXTAREAstyle="IME-MODE: inactive" rows=5 cols=30 ]>영어</TEXTAREA><TEXTAREA style="IME-MODE: active" rows=5cols=30>한글</TEXTAREA>
* style="ime-mode:inactive;"(영어)
* style="ime-mode:active;"(한글)
[textarea내의 내용 자동선택]
<TEXTAREA onfocus="this.select()" rows="5" cols="60">textarea내의 내용 자동선택</TEXTAREA>
onMouseOver="this.focus()" onFocus="this.select()"
[textarea 자동으로 늘리기]
<TEXTAREAstyle="BORDER-RIGHT: #666666 1px solid; BORDER-TOP: #666666 1px solid;OVERFLOW: visible; BORDER-LEFT: #666666 1px solid; WIDTH: 100%;BORDER-BOTTOM: #666666 1px solid; HEIGHT: 50px; TEXT-OVERFLOW:ellipsis" name=memo> </TEXTAREA>style="width:100%;height:50;border:1 solid#333333;overflow:visible;text-overflow:ellipsis;"
Subscribe to:
Posts (Atom)