表單的目的
表單是為了收集用戶信息而存在的，是網(wǎng)頁中常見的與用戶進(jìn)行交互的一種方式
表單的組成
一個完整的表單由表單域、表單控件與提示信息組成
表單域
定義整個表單范圍的元素固逗，在表單域中設(shè)定submit按鈕之后，可以提交當(dāng)前表單域中所有的數(shù)據(jù)到指定url地址广辰。表單域內(nèi)部可以包含大部分標(biāo)簽元素查邢，它在頁面上并不會體現(xiàn)出具體的結(jié)構(gòu)，而是作為一張表單所需收集數(shù)據(jù)的限定范圍
表單控件
用來定義各種表單元素我擂，允許用戶在表單中輸入或選擇的內(nèi)容控件（輸入框淮逊，選擇按鈕或者下拉菜單等）
input、select和textarea都是表單控件的三種元素
input表單元素
其中扶踊，type屬性值有以下類型泄鹏，他們具體的作用是改變input表單元素的形態(tài)，亦或是文本框的輸入方式
這是實(shí)現(xiàn)表單的必要屬性秧耗，除此之外备籽，input元素還具有以下其它屬性
label標(biāo)簽
label作為html雙標(biāo)簽結(jié)構(gòu)，僅在網(wǎng)頁上顯示出所包括的提示信息
label常常會和網(wǎng)頁上的表單控件元素綁定到一起使用分井，比如說：
select元素
textarea
一個表單的實(shí)例
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<!-- 綜合練習(xí) -->
<h4>青春不常在车猬，抓緊談戀愛</h4>
<form action="xxx.php" method="post" name="regster">
<table width="600px">
<tr>
<td>性別</td>
<td>
<input type="radio" name="sex" id="male">
<label for="male"><img src="images/man.jpg"> 男</label>
<input type="radio" name="sex" id="female">
<label for="female"><img src="images/women.jpg"> 女</label>
</td>
</tr>
<tr>
<td>生日</td>
<td>
<select>
<option selected="selected">--請選擇年份--</option>
<option>1999</option>
<option>1998</option>
<option>1997</option>
<option>1996</option>
<option>1995</option>
<option>1994</option>
<option>1993</option>
<option>1992</option>
<option>1991</option>
<option>1990</option>
</select>
<select>
<option selected="selected">--請選擇月份--</option>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
<option>8</option>
<option>9</option>
<option>10</option>
<option>11</option>
<option>12</option>
</select>
<select>
<option selected="selected">--請選擇日期--</option>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
<option>8</option>
<option>9</option>
<option>10</option>
<option>11</option>
<option>12</option>
<option>...</option>
</select>
</td>
</tr>
<tr>
<td>所在地區(qū)</td>
<td>
<input type="text" value="北京">
</td>
</tr>
<tr>
<td>婚姻狀況</td>
<td>
<input type="radio" name="marry" id="married">
<label for="married">已婚</label>
<input type="radio" name="marry" id="unmarried" checked="checkeds">
<label for="unmarried">未婚</label>
<input type="radio" name="marry" id="breakoff">
<label for="breakoff">離婚</label>
</td>
</tr>
<tr>
<td>學(xué)歷</td>
<td>
<input type="text" value="本科">
</td>
</tr>
<tr>
<td>喜歡的類型</td>
<td>
<input type="checkbox" name="like" id="yuanqi">
<label for="yuanqi">元?dú)?lt;/label>
<input type="checkbox" name="like" id="chengshu">
<label for="chengshu">成熟</label>
<input type="checkbox" name="like" id="aojiao">
<label for="aojiao">傲嬌</label>
<input type="checkbox" name="like" id="neixiang">
<label for="neixiang">內(nèi)向</label>
<input type="checkbox" name="like" id="anjing">
<label for="anjing">安靜</label>
<input type="checkbox" name="like" id="all" checked="checked">
<label for="all">我都喜歡</label>
</td>
</tr>
<tr>
<td>自我介紹</td>
<td>
<textarea>自我介紹</textarea>
</td>
</tr>
<tr>
<td></td>
<td>
<input type="submit" value="免費(fèi)注冊">
</td>
</tr>
<tr>
<td></td>
<td>
<input type="checkbox" checked="checked" id="list">
<label for="list">我同意注冊條款和加入會員標(biāo)準(zhǔn)</label>
</td>
</tr>
<tr>
<td></td>
<td>
<a href="#">我是會員，立即登錄</a>
</td>
</tr>
<tr>
<td></td>
<td>
<h4>我承諾</h4>
<ul>
<li>年滿18尺锚，單身</li>
<li>抱著嚴(yán)肅的態(tài)度</li>
<li>真誠尋找另一半</li>
</ul>
</td>
</tr>
</table>
</form>
</body>
</html>
這里其實(shí)是將所有表單元素放到了表格當(dāng)中珠闰，然后隱藏了表格邊框，做出一種類似網(wǎng)頁排版的效果（實(shí)際開發(fā)中并不會這樣做瘫辩，因?yàn)楸砀癫⒉贿m合用作排版伏嗜，而更擅長用來展示數(shù)據(jù)）
在表格標(biāo)簽的外層包括了表單域form標(biāo)簽，點(diǎn)擊submit按鈕伐厌，依舊能夠提交數(shù)據(jù)承绸，這說明form提交數(shù)據(jù)的方式跟其內(nèi)部結(jié)構(gòu)并沒有太大聯(lián)系
總結(jié)來說就是所有關(guān)于表單的內(nèi)容一定要寫在form標(biāo)簽里面，包括submit按鈕挣轨，實(shí)際開發(fā)中如果需要用戶填寫多個表單军熏，用多個form標(biāo)簽來劃分區(qū)域并區(qū)分name屬性是最合適的（當(dāng)然這種情況實(shí)際上并不多見）
