前言：
form表單是一個(gè)網(wǎng)頁很重要的組成部分，它具有可供用戶填寫岸梨、選擇雇卷、上傳信息并把這些信息集中起來交由代后臺(tái)服務(wù)器處理的作用。
一鲸睛，<form> 標(biāo)簽
<form action="##" method="post">
<label for="uname">名字:</label>
<input type="text" name="uname" id="uname" >
</form>
<form> 標(biāo)簽于用于創(chuàng)建HTML 表單，如代碼上一樣始終包含文本字段坡贺、復(fù)選框官辈、單選框、提交按鈕等等遍坟，以便把所填寫的信息遞交給后臺(tái)服務(wù)器拳亿。
| 主要屬性 | 主要的值 | 功能 |
|---|---|---|
| action | * url* | 規(guī)定當(dāng)提交表單時(shí)向何處發(fā)送表單數(shù)據(jù)。 |
| method | post愿伴，get | 規(guī)定以何種方式向action的值發(fā)送請求. |
| name | form_name | 規(guī)定表單的名字肺魁。 |
二，<label>標(biāo)簽
<form action="#" method="post">
<label for="uname">名字:</label>
<input type="text" name="uname" id="uname" >
</form>
<label> 標(biāo)簽為 input 元素定義標(biāo)注（標(biāo)記）隔节，為它設(shè)置for屬性鹅经，當(dāng)鼠標(biāo)點(diǎn)擊它的時(shí)候，相應(yīng)的input元素表單控件自動(dòng)獲取焦點(diǎn)怎诫。
| 主要屬性 | 主要的值 | 功能 |
|---|---|---|
| for | id | 規(guī)定 label 綁定到哪個(gè)表單元素瘾晃。 |
| form | formid | 規(guī)定 formid綁定到哪個(gè)表單元素。 |
三幻妓，<input>標(biāo)簽
<form action="##" method="post">
<div>
<label for="uname">名字:</label>
<input type="text" name="uname" id="uname" placeholder="請輸入您的名字">
</div>
<div>
<label for="password">密碼:</label>
<input type="password" name="password" id="password" placeholder="請輸入您的密碼">
</div>
<div>
<label>性別:</label>
<input type="radio" name="sex" value="男" >男
<input type="radio" name="sex" value="女" >女
</div>
<div>
<label>取向：</label>
<input type="radio" name="uso" value="男" >男
<input type="radio" name="uso" value="女" >女
<input type="radio" name="uso" value="男&女" >男&女
<div>
<label>愛好：</label>
<input type="checkbox" name="hobby" value="hy1" >吃飯
<input type="checkbox" name="hobby" value="hy2" >睡覺
<input type="checkbox" name="hobby" value="hy3" >打豆豆
</div>
<div>
<label for="uword">請上傳您的文章:</label>
<input type="file" name="word">
</div>
</form>
效果如下圖：
| 主要屬性 | 主要的值 | 功能 |
|---|---|---|
| type | button蹦误，checkbox，file肉津，hidden强胰，image，password妹沙，radio偶洋，reset，submit初烘，text | 規(guī)定 input的形態(tài)如文本域涡真，密碼域等 |
| placeholder | text | 可描述輸入字段預(yù)期值的提示信息 |
| value | value | 規(guī)定 input 元素的值 |
| name | name | 元素的名稱 |
| checked | checked | 規(guī)定此 input 元素首次加載時(shí)應(yīng)當(dāng)被選中 |
<input>標(biāo)簽是form表單最重要的標(biāo)簽分俯，它的type屬性可以讓它變成各種形態(tài)。
| 主要屬性 | 主要的值 | 功能 |
|---|---|---|
| type | button哆料，checkbox缸剪，file，hidden东亦，image杏节，password，radio典阵，reset奋渔，submit，text | 規(guī)定 input的形態(tài)如文本域壮啊，密碼域等 |
| placeholder | text | 可描述輸入字段預(yù)期值的提示信息 |
| value | value | 規(guī)定 input 元素的值 |
| name | name | 元素的名稱 |
| checked | checked | 規(guī)定此 input 元素首次加載時(shí)應(yīng)當(dāng)被選中 |
四嫉鲸，<select>標(biāo)簽，<option>標(biāo)簽
<form action="##" method="post">
<select name="car">
<option value="寶馬">寶馬</option>
<option value="奔馳" selected="selected">奔馳</option>
<option value="法拉利">法拉利</option>
</select>
</form>
效果如下圖：
用<select>標(biāo)簽創(chuàng)建下拉列表歹啼，<option>標(biāo)簽創(chuàng)建的選擇項(xiàng)玄渗。
1.<select>標(biāo)簽：
| 主要屬性 | 主要的值 | 功能 |
|---|---|---|
| name | name | 規(guī)定下拉列表的名稱。 |
| size | number | 規(guī)定下拉列表的可以見數(shù)量 |
| multiple | multiple | 規(guī)定可選擇多個(gè)選項(xiàng)狸眼。 |
2.<option>標(biāo)簽：
| 主要屬性 | 主要的值 | 功能 |
|---|---|---|
| value | text | 定義送往服務(wù)器的選項(xiàng)值 |
| selected | selected | 默認(rèn)被選中的值 |
五藤树， <textarea> 標(biāo)簽
<form action="##" method="post">
<label>評(píng)論：</label>
<textarea placeholder="請輸入您評(píng)論"></textarea>
</form>
效果如下圖：
| 主要屬性 | 主要的值 | 功能 |
|---|---|---|
| name | name_of_textarea | 規(guī)定文本區(qū)的名稱 |
| readonly | readonly | 規(guī)定文本區(qū)為只讀 |
| maxlength | number | 規(guī)定文本區(qū)域的最大長度（以字符計(jì)） |
| placeholder | text | 規(guī)定描述文本區(qū)域預(yù)期值的簡短提示 |
用<textarea>標(biāo)簽創(chuàng)建多行輸入框，標(biāo)簽對中的字符會(huì)默認(rèn)出現(xiàn)拓萌。
| 主要屬性 | 主要的值 | 功能 |
|---|---|---|
| name | name_of_textarea | 規(guī)定文本區(qū)的名稱 |
| readonly | readonly | 規(guī)定文本區(qū)為只讀 |
| maxlength | number | 規(guī)定文本區(qū)域的最大長度（以字符計(jì)） |
| placeholder | text | 規(guī)定描述文本區(qū)域預(yù)期值的簡短提示 |
六岁钓，按鈕
<form action="##" method="get">
<div>
<label for="uname">名字:</label>
<input type="text" name="uname" id="uname" >
</div>
<div>
<label for="password">密碼:</label>
<input type="password" name="password" id="password" >
</div>
<button>提交</button>
<input type="submit" value="提交">
<input type="reset" value="清空">
</form>
效果如下圖：
<button>和 <input type="submit">都可創(chuàng)建提交按鈕，按下即可提交同在一form表單內(nèi)的數(shù)據(jù)微王， <input type="reset">可創(chuàng)建清空按鈕屡限，按下即可清空同在一form表單內(nèi)的數(shù)據(jù)（預(yù)設(shè)的value值無法清空）
