說(shuō)明：以下內(nèi)容是基于w3school及饑人谷教學(xué)內(nèi)容，對(duì)HTML表單元素做的簡(jiǎn)單說(shuō)明衰伯。
<form> 元素
<form> 元素定義 HTML 表單區(qū)間，而這個(gè)區(qū)間的數(shù)據(jù)將會(huì)被提交給后臺(tái)佣盒。
例子：
<input type="textarea"/> 請(qǐng)輸入留言
<br/>
<form action="/abc">
<input type="password"/> 請(qǐng)輸入密碼
<br/>
<input type="submit"/>
</form>
結(jié)果是form標(biāo)簽內(nèi)的數(shù)據(jù)，password才會(huì)被提交屏镊，而textarea的內(nèi)容不會(huì)被提交速妖。
<input> 元素
<input> 元素是最重要的表單元素妹蔽。
<input> 元素有很多形態(tài)，根據(jù)不同的 type 屬性有以下類型：
| 序號(hào) | 類型 | 描述 |
|---|---|---|
| 1 | text | 用于文本輸入的單行輸入字段神帅，默認(rèn)寬度20字符再姑。 |
| 2 | password | 密碼輸入框，密碼會(huì)自動(dòng)顯示為 ● |
| 3 | checkbox | 用于創(chuàng)建多選/復(fù)選框 |
| 4 | radio | 用于創(chuàng)建單選框 |
| 5 | file | 用于上傳文件找御， accept屬性可以限制文件上傳類型元镀。 |
| 6 | hidden | 這種類型的輸入元素實(shí)際上是隱藏的。這個(gè)不可見的表單元素的 value 屬性保存了一個(gè)要提交給 Web 服務(wù)器的任意字符串霎桅。如果想要提交并非用戶直接輸入的數(shù)據(jù)的話栖疑，就是用這種類型的元素。 |
| 7 | button | 用于創(chuàng)建一個(gè)按鈕滔驶，顯示名稱為value屬性的值 |
| 8 | submit | 用于創(chuàng)建一個(gè)提交按鈕遇革，顯示名稱為value屬性的值 |
| 9 | reset | 當(dāng)重置按鈕被點(diǎn)擊，包含它的表單中所有輸入元素的值都重置為它們的默認(rèn)值揭糕。默認(rèn)值由 HTML value 屬性或 JavaScript 的 defaultValue 屬性指定萝快。 |
其他標(biāo)簽
1、<label>標(biāo)簽
label標(biāo)簽本身不會(huì)產(chǎn)生任何特殊效果插佛，但是可以用于改進(jìn)用戶可用性及體驗(yàn)性，當(dāng)設(shè)置label的for=“某個(gè)元素的id”時(shí)量窘，點(diǎn)擊label標(biāo)簽的內(nèi)容雇寇，會(huì)自動(dòng)focus到該標(biāo)簽。
如下例蚌铜，當(dāng)我們點(diǎn)擊<b>輸入密碼</b>幾個(gè)文本時(shí)锨侯，當(dāng)前頁(yè)面會(huì)自動(dòng)focus到password的輸入框，而不必點(diǎn)擊該輸入框冬殃。
<input type="password" id="ps"/>
<label for="ps">請(qǐng)輸入密碼</label>
2囚痴、<textarea>標(biāo)簽
用于創(chuàng)建一個(gè)可以指定寬高的文本輸入框，內(nèi)容長(zhǎng)度不限审葬∩罟觯可以通過cols和rows屬性控制寬高，但是兼容性不好涣觉，原因見下記網(wǎng)址詳細(xì)分析痴荐。
http://www.zhangxinxu.com/wordpress/2016/02/html-textarea-rows-height/
<textarea name="" id="" cols="30" rows="10">this is a example</textarea>
3、<select>標(biāo)簽
select 元素可創(chuàng)建單選或多選菜單官册，菜單選項(xiàng)為<option>標(biāo)簽生兆。
<select name="city" id="city">
<option value="shanghai">上海</option>
<option value="beijing">北京</option>
<option value="tianjin" selected>天津</option>
</select>
