9-23.表单实战 

<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>表单实战</title>
	</head>

	<body>
		<form action="http://www.baidu.com" method="get">
			姓名*：<input type="text" name="uname" placeholder="请输入..." required/>
			<br /><br />密码*：
			<input type="password" name="pwd" />
			<br /><br /> 性别*：
			<input type="radio" name="sex" value="male" required/>男
			<input type="radio" name="sex" value="female" required />女
			<br /> <br />年龄*：
			<input type="number" name="age" min="1" max="100" required />
			<br /> <br />选择课程*：
			<input type="checkbox" name="lessons[]" value="kc1" required />课程1
			<input type="checkbox" name="lessons[]" value="kc2" required />课程2
			<input type="checkbox" name="lessons[]" value="kc3" required />课程3
			<br /><br /> 手机*：
			<input type="tel" name="tel" pattern="[0-9]{11}" required />
			<br /><br />
			所在城市*：<select name="province" required5>
				<option value="heibei">河北省</option>
				<option value="jiangxi">江西省</option>
				<option value="hunan">湖南省</option>
			</select>
			<select name="area" >
				<option value="xx">xx区</option>
				<option value="yy">yy区</option>
				<option value="zz">zz区</option>
			</select>
			<br /><br />
			住址：<input type="text" name="address" placeholder="输入地址..." />
			<br /><br />
			备注：<textarea name="beizhu"style="width:150px;height: 200px;">
				
			</textarea>
			<br /><br />
			<input type="submit" value="发送" />
			<input type="reset" value="重置" />
		</form>
	</body>

</html>

　　

posted on 2021-11-04 22:54  Walker-Yang  阅读(30)  评论(0)    收藏  举报

导航