说明：以下内容是基于w3school及饥人谷教学内容，对HTML表单元素做的简单说明。
<form> 元素
<form> 元素定义 HTML 表单区间，而这个区间的数据将会被提交给后台。
例子：
<input type="textarea"/> 请输入留言
<br/>
<form action="/abc">
<input type="password"/> 请输入密码
<br/>
<input type="submit"/>
</form>
结果是form标签内的数据，password才会被提交，而textarea的内容不会被提交。
<input> 元素
<input> 元素是最重要的表单元素。
<input> 元素有很多形态，根据不同的 type 属性有以下类型：
| 序号 | 类型 | 描述 |
|---|---|---|
| 1 | text | 用于文本输入的单行输入字段，默认宽度20字符。 |
| 2 | password | 密码输入框，密码会自动显示为 ● |
| 3 | checkbox | 用于创建多选/复选框 |
| 4 | radio | 用于创建单选框 |
| 5 | file | 用于上传文件， accept属性可以限制文件上传类型。 |
| 6 | hidden | 这种类型的输入元素实际上是隐藏的。这个不可见的表单元素的 value 属性保存了一个要提交给 Web 服务器的任意字符串。如果想要提交并非用户直接输入的数据的话，就是用这种类型的元素。 |
| 7 | button | 用于创建一个按钮，显示名称为value属性的值 |
| 8 | submit | 用于创建一个提交按钮，显示名称为value属性的值 |
| 9 | reset | 当重置按钮被点击，包含它的表单中所有输入元素的值都重置为它们的默认值。默认值由 HTML value 属性或 JavaScript 的 defaultValue 属性指定。 |
其他标签
1、<label>标签
label标签本身不会产生任何特殊效果，但是可以用于改进用户可用性及体验性，当设置label的for=“某个元素的id”时，点击label标签的内容，会自动focus到该标签。
如下例，当我们点击<b>输入密码</b>几个文本时，当前页面会自动focus到password的输入框，而不必点击该输入框。
<input type="password" id="ps"/>
<label for="ps">请输入密码</label>
for=id示例
2、<textarea>标签
用于创建一个可以指定宽高的文本输入框，内容长度不限。可以通过cols和rows属性控制宽高，但是兼容性不好，原因见下记网址详细分析。
http://www.zhangxinxu.com/wordpress/2016/02/html-textarea-rows-height/
<textarea name="" id="" cols="30" rows="10">this is a example</textarea>
文本框中的值为value值
3、<select>标签
select 元素可创建单选或多选菜单，菜单选项为<option>标签。
<select name="city" id="city">
<option value="shanghai">上海</option>
<option value="beijing">北京</option>
<option value="tianjin" selected>天津</option>
</select>
secect注意事项
网友评论