表单各种元素

WEB前端 waitig 628℃ 百度已收录 0评论
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
</head>
<body>
	<input type="text" maxlength="10" value="123456789101111" readonly/>
	姓名;<input type="text" name="username" value="mary" maxlength="6" />
	密码:<input type="password" name="pwd" />
	<input type="radio"/ checked>
	<input type="checkbox"/ checked>
	<br/>
	性别:
	<input type="radio" name="sex" value="0" />男
	<input type="radio" name="sex" value="1" />女
	<input type="radio" name="sex" value="2" checked="checked" />保密
	<br/>
	喜欢的城市:
	<input type="checkbox" name="cities" value="1" />北京
	<input type="checkbox" name="cities" value="2" />厦门
	<input type="checkbox" name="cities" value="3" />敦煌
	<input type="checkbox" name="cities" value="4" checked="checked">杭州
	<br/>
	<input type="submit">
	<input type="reset">
	<input type="button">
	<input type="hidden">
	<input type="file">
	<br/>
	<input type="checkbox" name="chkHid" id="chkHid" />
	<label for="chkHid">不要公开我的信息</label><br/>
	<select name="" id="">
		<option value="1">Java</option>
		<option value="2">C++</option>
		<option value="3">PHP</option>
	</select>
	<select name="" id="" size="4">
		<option value="1">Java</option>
		<option value="2">C++</option>
		<option value="3">PHP</option>
	</select>
	<br/>
	<textarea name="txtInfo" id="" cols="30" rows="10"></textarea>
	<br/>
	<!-- 为控件分组 -->
	<fieldset>
		<legend>地址信息</legend>
		地址:<input type="text" /><br/>
		邮编:<input type="text" name="">
	</fieldset>
	<br/>
	浮动框架<iframe src="35.html"></iframe>
	<br/>
	<form action="">
		<input type="email" />
		<input type="submit">
	</form>
	<form action="">
		<input type="search" />
		<input type="submit">
	</form>
	<form action="">
		<input type="url" />
		<input type="submit" />
	</form>
	<input type="tel" />
	<input type="number" min="3" max="100" step="3">
	<input type="range" min="10" max="1000" value="50" />
	<br/>
	<input type="color" /><br/>
	<input type="date" /><br/>
	<input type="week" /><br/>
	<input type="month" />
</body>
</html>

效果图:


本文由【waitig】发表在等英博客
本文固定链接:表单各种元素
欢迎关注本站官方公众号,每日都有干货分享!
等英博客官方公众号
点赞 (0)分享 (0)