表单

form的action属性指定由谁来处理用户提交的表单

form的method属性指定使用哪种http方法将表单发送给服务器，有get和post两种，这两种最明显的区别就是get方法会将提交的数据整合到url里，而post不会这样，post的提交会随http消息的主体发送到服务器。

input就是加一个输入框。

button是加一个按钮。

<!DOCTYPE>
<html>
<head>

</head>
<body>
	<form action=" " method="post">
		名字：<input type="text" name="name"><br><br>
		邮箱：<input type="text" name="email"><br><br>
		<button type="submit">提交</button>
	</form>
</body>
</html>

自动填充：

autocomplete属性，默认值为on，也就是会自动打开自动填充，form，input有这个属性。

指定目标显示位置：

form的target属性，指定响应表单的页面应该在哪显示，是在本页面，还是在新标签页。

设置默认值：

给输入框设置默认值，用value属性。

自动聚焦：

这个功能就是表单一加载出来，就把光标定到某个input的输入框里。需要autofocus属性

禁用元素：

disabled属性，使用后该输入框无法点击。button和input都可以用。

禁止修改：

input元素使用，使输入框内的内容无法修改。readonly

label元素：

没有视觉上的特殊效果，但可以提高用户的交互体验，在表单中，将文本和input用label包裹起来后，点击输入框前的文本也可以使光标进入到输入框，为隐式关联。

<label>性别：<input type="text" name="sex" ></label><br><br>

label元素有个for属性，它的值可以指定另一个元素的id属性值,id不能重复。然后这两个元素就可以关联起来。

		<label for="sex111">性别：</label><input type="text" name="sex" id="sex111"><br><br>

fieldset元素：

将表单内的相关元素进行分组。

<!DOCTYPE>
<html>
<head>

</head>
<body>
	<form target="_blank" action=" " method="post" autocomplete="off">
		<fieldset>
			名字：<input type="text" name="name" ><br><br>
			邮箱：<input type="text" name="email" ><br><br>
		</fieldset>
		<br>
		<fieldset>
			性别：<input type="text" name="sex" ><br><br>
			等级：<input type="text" name="等级"><br><br>
		</fieldset>
		<button type="submit">提交</button>
	</form>
</body>
</html>

legend元素：

用来给分组的input命名，legend元素必须作为fieldset的第一个子元素出现。

<!DOCTYPE>
<html>
<head>

</head>
<body>
	<form target="_blank" action=" " method="post" autocomplete="off">
		<fieldset>
			<legend>第一组信息</legend>
			名字：<input type="text" name="name" ><br><br>
			邮箱：<input type="text" name="email" ><br><br>
		</fieldset>
		<br>
		<fieldset>
			<legend>第二组信息</legend>
			性别：<input type="text" name="sex" ><br><br>
			等级：<input type="text" name="等级"><br><br>
		</fieldset>
		<button type="submit">提交</button>
	</form>
</body>
</html>

select元素和option元素：

制作下拉选项框,option的value的值是给服务器发送的值。

		<select>
			<option value="male">男</option>
			<option value=="female">女</option>
		</select>

optgroup元素：

对下拉列表的选项进行分组

<!DOCTYPE>
<html>
<head>

</head>
<body>
	<p>你最喜欢的游戏角色是：</p>
	<select>
		<optgroup label="黑暗之魂中的">
			<option>太阳骑士</option>
			<option>洋葱骑士</option>
			<option>灰心哥</option>
			<option>半龙妹</option>
		</optgroup>
		<optgroup label="鬼泣中的">
			<option>但丁</option>
			<option>尼尔</option>
			<option>维吉尔</option>
			<option>V</option>
		</optgroup>
		<optgroup label="巫师中的">
			<option>杰洛特</option>
			<option>希里</option>
			<option>维瑟米尔</option>
		</optgroup>
	</select>
</body>
</html>