本節書摘來自異步社群《web前端開發精品課 html與css進階教程》一書中的第2章，第2.5節，作者： 莫振傑 更多章節内容可以通路雲栖社群“異步社群”公衆号檢視。
表單跟表格，這是兩個完全不一樣的概念，不過還是有不少初學者傻傻分不清。對于表單語義化，我們從2個方面來探究一下。
（1）label标簽。
（2）fieldset标簽和legend标簽。
對于圖2-8所示效果，我們可能會使用如下html代碼來實作。
2.5.1 label标簽
w3c規範定義，label标簽用于顯示在輸入控件旁邊的說明性文字。也就是将某個表單元素和某段說明文字關聯起來。
文法：
說明：
label标簽的for屬性有兩個作用。
（1）語義上綁定了label元素和表單元素。
（2）增強了滑鼠可用性。也就是說我們點選label中的文本時，其所關聯的表單元素也會獲得焦點。
舉例：
在浏覽器預覽效果如圖2-9所示。
分析：
從這個例子可以看到，在第一組表單中，我們隻能點選單選框才能選中單選框，點選它旁邊的說明文字是不能選中的。在第二組表單中，我們可以點選單選框來選中單選框，并且點選它旁邊的說明文字同樣也可以選中單選框。而對于複選框來說，也是一樣的效果。
其實，這就是label标簽for屬性的作用。for屬性使得滑鼠單擊的範圍擴大到label元素上，極大地提高了使用者單擊的可操作性。事實上，label标簽有兩種關聯方式，我們拿複選框來說，下面兩行代碼是等價的。
對于圖2-8中的效果，我們使用label标簽來增強語義化，修改後的代碼如下。
2.5.2 fieldset标簽和legend标簽
在表單中，我們還可以使用fieldset标簽來給表單元素進行分組。其中，legend标簽用于定義某一組表單的标題。
使用fieldset和legend标簽有兩個作用。
（1）增強表單的語義。
（2）可以定義fieldset元素的disabled屬性來禁用整個組中的表單元素。
對于圖2-8中的效果，我們使用fieldset和legend這兩個标簽來增強語義化，修改後的代碼如下。
在浏覽器預覽效果如圖2-10所示。
https://yqfile.alicdn.com/a739016172712c421050987a5012d8b27af056bd.png" >
我們可以看到，使用了fieldset和legend這兩個标簽之後，表單形成了非常美觀的“書簽”效果。