HTML5之表单示例

<form method=post>
	<fieldset>
		<ol>
			<li style=height:30px;>
				<label for=username>用户名</label>
				<input name=username required autofocus type=text pattern=[a-zA-Z0-9]{6,16}><font color=red>*</font>
			</li>
			<li style=height:30px;>
				<label for=uemail>邮 箱</label>
				<input name=uemail placeholder=example@domain.com required type=email><font color=red>*</font>
			</li>
			<li style=height:30px;>
				<label for=upwd>密 码</label>
				<input name=upwd placeholder=请填写密码 required type=password><font color=red>*</font>
			</li>
			<li style=height:30px;>
				<label for=age>年 龄</label>
				<input type=text id=agetext name=agetext size=3>
				<input name=age min=18 max=60 value=20 type=range onchange=checkAge(this);>
				<span id=agev>最小18周岁</span>
			</li>
			<li style=height:30px;>
				<label for=age2>数 字</label>
				<input name=age2 min=18 max=60 placeholder=数字 type=number>
			</li>
			<li style=height:30px;>
				<label for=tel>电 话</label>
				<input type=tel name=tel>
			</li>
			
			<li style=height:30px;>
				<label for=birthday>日 期</label>
				<input name=birthday type=date>
			</li>
			<li style=height:30px;>
				<label for=birthday>时 间</label>
				<input name=birthday type=datetime>
			</li>
			<li style=height:30px;>
				<label for=month>月 份</label>
				<input name=month type=month>
			</li>
			<li style=height:30px;>
				<label for=month>星 期</label>
				<input name=month type=week>
			</li>
			<li style=height:30px;>
				<label for=htturl>网 址</label>
				<input name=htturl type=url>
			</li>
			<li style=height:30px;>
				<label for=bgcol>颜 色</label>
				<input name=bgcol type=color>
			</li>
			<li style=height:30px;>
				<label for=search>搜 索</label>
				<input name=search type=search results=s>
			</li>
			<li style=height:30px;>
				<label for=list>列 表</label>
				<input name=list type=text list=searchlist>
				<datalist id=searchlist>
					<option label=a value=我>
					<option label=b value=你>
					<option label=c value=他>
				</datalist>
			</li>
			
		</ol>
	</fieldset>
	<div>
		<input type=submit value=提交>
	</div>
</form>

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值