HTML form 表单组合功能使用

卡尔特斯
192 阅读1分钟 
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
</head>
<body>
	<form action="1.php" method="post">
	<fieldset>
	<legend>分组信息</legend>


	<!-- 文本输入框 -->
	用户名:<input type="text" maxlength="6"  name="username" value="大前端">
	<br>
	<br>
	   <!-- 密码输入框 -->
	   密码:<input type="password" name="pwd">
	<br>
	<br>
	   <!-- 单选框 -->
	   <input type="radio" name="gender" checked="checked">男

	   <input type="radio" name="gender">女
	   <br><br>
	   <!-- 下拉列表 -->
	   省(市)： <select>
					<option>河北</option>
					<option>山西</option>
					<option>山东</option>
					<option selected="selected">北京</option>
	   			</select>
	   			<!-- 下拉列表多选 -->
	   			<select multiple="multiple">
					<option>河北</option>
					<option>山西</option>
					<option>山东</option>
					<option selected="selected">北京</option>
	   			</select>
	   	市(区):<select>
	   	      <!-- 下拉列表信息分组 -->
	   			<optgroup label="北京市">
	   			<option>昌平区</option>
	   			<option>海淀区</option>
	   			<option>朝阳区</option>
	   			<option>大兴区</option>
	   			</optgroup>
	   			<optgroup label="广州市">
	   			<option>昌平区</option>
	   			<option>海淀区</option>
	   			<option>朝阳区</option>
	   			<option>大兴区</option>
	   			</optgroup>
	   	       </select>
	   	       <br><br>
	   	       <!-- 多选框 -->
	   	       <input type="checkbox" checked="checked">喝酒
	   	       <input type="checkbox" checked="checked">抽烟
	   	       <input type="checkbox" checked="checked">烫头

	   	       <!-- 多行文本框 -->
	   	       <textarea cols="130" rows="10"></textarea><br><br>

	   	       <!-- 文件上传控件 -->
	   	       <input type="file">
				<br><br>

				<!-- 文件提交按钮 -->
	   	       <!-- <input type="submit"> -->

				<!-- 普通按钮 -->
	   	       <!-- <input type="button" value="普通按钮"> -->

	   	       <!-- 图片按钮 -->
	   	       <input type="image" src="按钮.jpg">

	   	       <!-- 重置按钮 -->
	   	       <input type="reset">
	   	       </fieldset>
	</form>
	
</body>
</html>
  • demo 效果：

avatar
文章
阅读
粉丝