|
马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。
您需要 登录 才可以下载或查看,没有帐号?立即注册
x
WHATWG版和W3C版的HTML5规范虽然根源相同,在一些领域却已经产生分歧。破洛洛文章简介:input输出框的各类款式。
输出框景背景通明:
<inputstyle="background:transparent;border:1pxsolid#ffffff">
鼠标划过输出框,输出框背景致变色:
<INPUTvalue="Typehere"NAME="user_pass"TYPE="text"SIZE="29"onmou搜索引擎优化ver="this.style.borderColor=black;this.style.backgroundColor=plum"
style="width:106;height:21"
onmou搜索引擎优化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"onfocus="borderColor(this);"onblur="clearTimeout(oTime);">
输出字时输出框边框闪灼(边框为虚线):
<style>
#oText{border:1pxdotted#ff0000;ryo:expression(onfocus=functionlight(){with(document.all.oText){style.borderColor=(style.borderColor=="#ffee00"?"#ff0000":"#ffee00");timer=setTimeout(light,500);}},onblur=function(){this.style.borderColor="#ff0000";clearTimeout(timer)})};
</style>
<inputtype="text"id="oText">
主动横向廷伸的输出框:
<inputtype="text"style="huerreson:expression(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">—<inputname="T"size="5"maxlength="3">—<inputname="T"size="5"maxlength="3">—<inputname="T"size="5"maxlength="3">
<inputtype="submit"name="Submit">
</p>
随着高端手机(Andriod,Iphone,Ipod,WinPhone等)的盛行,移动互联应用开发也越来越受到人们的重视,用html5开发移动应用是最好的选择。 |
|