HTML中的 <label> 標簽用于為表單元素提供標簽文本。它通常與輸入元素(如文本框、復選框、單選按鈕等)關聯,以提供更好的用戶體驗和可訪問性。
主要用途包括:
1. 表單標記:<label> 標簽用于標識表單控件的名稱或說明。通過將標簽與相應的表單元素相關聯,用戶可以點擊標簽時自動聚焦到該元素,并且屏幕閱讀器可以正確讀取標簽內容。
2. 用戶體驗改善:使用 <label> 可以增加表單的可點擊區域。當用戶單擊與輸入元素相關聯的標簽時,輸入元素會獲得焦點,這使得在移動設備上更容易選擇輸入。
3. 輔助功能支持:對于使用輔助技術的用戶,關聯 <label> 和表單元素可以提供更好的可訪問性。屏幕閱讀器可以讀取出 <label> 的內容,并告知用戶與之相關的輸入元素的用途或類型。
以下是一個示例,展示了如何使用 <label> 來標記文本輸入框:
<label for="username">Username:</label><input type="text" id="username" name="username">
在上面的示例中,for 屬性指定了與 <label> 相關聯的輸入元素的 id,以建立它們之間的關聯。這樣做可以使用戶在單擊標簽時自動聚焦到輸入框,并且屏幕閱讀器可以正確地讀取標簽文本。