html5 文字边框,html5的文本框样式有哪些

输入框景背景透明：<inputstyle="background:transparent;border:1pxsolid#ffffff">鼠标划过输入框，输入框背景色变色：<INPUTvalue="Typehere"NAME="user_pass"TYPE="text"SIZE="29"οnmοuseοver="this.style.borderColor='black';this.style.backgroundColor='plum'"style="width:106;height:21"οnmοuseοut="this.style.borderColor='black';this.style.backgroundColor='#ffffff'"style="border-width:1px;border-color=black">输入字时输入框边框闪烁(边框为小方型)：<ScriptLanguage="JavaScript">functionborderColor(){if(self['oText'].style.borderColor=='red'){self['oText'].style.borderColor='yellow';}else{self['oText'].style.borderColor='red';}oTime=setTimeout('borderColor()',400);}</Script><inputtype="text"id="oText"style="border:5pxdottedred;color:red"οnfοcus="borderColor(this);"οnblur="clearTimeout(oTime);">输入字时输入框边框闪烁(边框为虚线)：<style>#oText{border:1pxdotted#ff0000;ryo:expression_r(οnfοcus=functionlight(){with(document.all.oText){style.borderColor=(style.borderColor=="#ffee00"?"#ff0000":"#ffee00");timer=setTimeout(light,500);}},οnblur=function(){this.style.borderColor="#ff0000";clearTimeout(timer)})};</style><inputtype="text"id="oText">自动横向廷伸的输入框：<inputtype="text"style="huerreson:expression_r(this.width=this.scrollWidth)"value="abcdefghijk">自动向下廷伸的文本框：<textareaname="content"rows="6"cols="80"onpropertychange="if(this.scrollHeight>80)this.style.posHeight=this.scrollHeight+5">输入几个回车试试</textarea>只有下划线的文本框：<inputstyle="border:0;border-bottom:1solidblack;background:;">软件序列号式的输入框：<scriptfor="T"event="onkeyup">if(value.length==3)document.all[event.srcElement.sourceIndex+1].select();</script><inputname="T"size="5"maxlength="3">—<inputname="T"size="5"maxlength="3">—<inputname="T"size="5"maxlength="3">—<inputname="T"size="5"maxlength="3">—<inputname="T"size="5"maxlength="3">—<inputname="T7"size="5"maxlength="3">软件序列号式的输入框(完整版)：<scriptfor="T"event="onkeyup">if(value.length==maxLength)document.all[event.srcElement.sourceIndex+1].focus();</script><scriptfor="T"event="onfocus">select();</script><scriptfor="Submit"event="onclick">varsn=newArray();for(i=0;i<T.length;i++)sn=T.value;alert(sn.join("—"));</script><inputname="T"size="5"maxlength="3">—<inputname="T"size="5"maxlength="3">—<inputname="T"size="5"maxlength="3&amp

;#34;>—<inputname="T"size="5"maxlength="3">—<inputname="T"size="5"maxlength="3">—<inputname="T"size="5"maxlength="3"><inputtype="submit"name="Submit">

阅读全文 >