文檔：
表單元素
一、表單元素匯總
form:表示HTML表單
input:表示用來(lái)收集用戶輸入數(shù)據(jù)的控件
textarea:表示可以輸入多行文本的控件
select:表示用來(lái)提供一組固定的選項(xiàng)
option:表示提供一個(gè)選項(xiàng)
optgroup:表示一組相關(guān)的option元素
buttton:表示可用來(lái)提交或者重置的表單按鈕（或一般按鈕）
datalist:定義一組提供給用戶的建議值
fieldset:表示一組表單元素
legend:表示fieldset元素的說(shuō)明性標(biāo)簽
label:表示表單元素的說(shuō)明標(biāo)簽
output:表示計(jì)算結(jié)果
二、表單元素解析
1、定義表單
<form>
用戶名：<input name="user">
<button>提交</button>
</form>
<form>元素主要是定義本身是一組表單。
屬性：
action：表示表單提交的頁(yè)面,默認(rèn)提交給當(dāng)前頁(yè)面
method:表示表單的請(qǐng)求方式，post和get兩種，默認(rèn)get
enctype:瀏覽器發(fā)送給服務(wù)器的數(shù)據(jù)所采用的編碼格式。不建議使用
name:設(shè)置表單的名稱，以便程序調(diào)用
target:設(shè)置提交時(shí)的目標(biāo)位置
autocomplete:設(shè)置瀏覽器記住用戶輸入的數(shù)據(jù)，實(shí)現(xiàn)自動(dòng)完成表單。默認(rèn)為on自動(dòng)完成，如果不想自動(dòng)完成則設(shè)置成off.
novalidate:設(shè)置是否執(zhí)行客戶端數(shù)據(jù)有效性檢查。
2、input：用戶輸入數(shù)據(jù)
屬性
autofocus:讓光標(biāo)聚焦在某個(gè)input元素上，讓用戶直接輸入。
disabled：禁用input元素，禁用后改input不能輸入文本了。
autocomplete:單獨(dú)設(shè)置input元素的自動(dòng)完成功能。
form：讓表單外的元素和指定的表單掛鉤提交。
type：input元素的類型，內(nèi)容較多，將在下節(jié)課講解。
name：定義input元素的名稱，以便接收到相應(yīng)的值。
<form method="get" id="login">
用戶名：<input name="user">
<button>提交</button><br>
</form>
<br>
電子郵件：<input name="email" form="login">
3、label標(biāo)簽：添加說(shuō)明標(biāo)簽
<form method="get" id="login">
<label>
用戶名：<input name="user">
<button>提交</button><br><br>
</label>
<label>
電子郵件：<input name="email" form="login">
</label>
</form>
能夠?qū)崿F(xiàn)當(dāng)點(diǎn)擊 “用戶名”的時(shí)候，光標(biāo)也會(huì)顯示在用戶名后面的輸入框中。讓用戶體驗(yàn)更好。
4、fieldset：對(duì)表單進(jìn)行編組
fieldset元素可以將一些表單元素組織在一起，形成一個(gè)整體。
屬性：
name：給分組定義一個(gè)名字。
form：讓表單外的分組與表單掛鉤
disable:禁用分組內(nèi)的表單
5、legend添加分組說(shuō)明標(biāo)簽
<fieldset name="pwd">
<legend>密碼表單</legend>
密碼:<input name="pass"><br><br>
確認(rèn)密碼:<input name="repass">
</fieldset>
6、button按鈕
type屬性：
submit：提交表單，默認(rèn)
reset：重置表單，不是清空，而是回到初始化的狀態(tài)，相當(dāng)于刷新。
button：一般性按鈕
<button type="submit">提交</button>
<button type="reset">重置</button>
<button type="button">按鈕</button>
源碼：
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
<title>表單元素</title>
</head>
<body>
<br><br>
表單元素
<hr><br>
<form method="get" id="login">
<fieldset name="username">
<legend>用戶名表單</legend>
<label>
用戶名：<input name="user">
</label>
<label>
電子郵件：<input name="email" form="login">
</label>
</fieldset><br><br>
<fieldset name="pwd">
<legend>密碼表單</legend>
密碼:<input name="pass"><br><br>
確認(rèn)密碼:<input name="repass">
</fieldset><br>
<button type="submit">提交</button>
<button type="reset">重置</button>
<button type="button">按鈕</button><br><br>
</form>
<br>
<!-- 電子郵件：<input name="email" form="login"> -->
</body>
</html>
