HTML label標籤是什麼意思？ HTML label標籤作用和屬性的用法實例

HTML label標籤是什麼意思？ HTML label標籤作用和屬性你知道哪些？本篇文章為大家解釋了HTML label標籤的定義與作用，還有HTML label標籤的兩種屬性詳解（附HTML label標籤for屬性的實例）

HTML label標籤的定義和用法：

標籤為input 元素定義標註（標記）。

label 元素不會向使用者呈現任何特殊效果。不過，它為滑鼠使用者改進了可用性。如果您在 label 元素內點擊文本，就會觸發此控制項。是說，當使用者選擇該標籤時，瀏覽器就會自動將焦點轉到和標籤相關的表單控制項。

標籤的 for 屬性應與相關元素的 id 屬性相同。

註解："for" 屬性可把 label 綁定到另一個元素。請把 "for" 屬性的值設定為相關元素的 id 屬性的值。

HTML label標籤的作用：

就是一個文字提示標籤，不過在label標籤中加入for屬性可以與對應的選項框進行捆綁，也就是說，在這種情況下你點擊這個文字框就會活的點擊選項框的效果。

範例：

<lable>男</lable>
<input style="checkbox">

就是滑鼠點擊"男"時，自動選擇後邊的文字方塊進行輸入

HTML label標籤的屬性：

其實主要是Label 中有兩個屬性是非常有用的,一個是FOR、另外一個就是ACCESSKEY了。

HTML label標籤中的FOR屬性：

功能：表示Label標籤要綁定的HTML元素，你點選這個標籤的時候，所綁定的元素將會取得焦點。

用法： 姓名

#HTML label標籤中的ACCESSKEY屬性：

功能：表示存取Label標籤所綁定的元素的熱鍵，當您按下熱鍵，所綁定的元素將取得焦點。

用法： 姓名

#限制：accessKey屬性所設定的快速鍵無法與瀏覽器的快速鍵衝突，否則將優先啟動瀏覽器的快速鍵。

注意：要將 LABEL 綁定到其它的控件，請將 LABEL 元素的 FOR 屬性設為與該控件的 ID 相同。將 LABEL 綁定到控制項的 NAME 屬性毫無用處。但是，要提交表單，你必須為 LABEL 元素所綁定到的控制項指定NAME。

HTML 標籤的for 屬性（附例）：

這有實例：

#有兩個輸入欄位和相關標記的簡單HTML 表單：

<form>
  <label for="male">Male</label>
  <input type="radio" name="sex" id="male" />
  <br />
  <label for="female">Female</label>
  <input type="radio" name="sex" id="female" />
</form>

HTML標籤的for 屬性定義與用法：

for 屬性規定label 與哪個表單元素綁定。

隱式和明確的聯繫

標記通常以下面兩種方式中的一種來和表單控制項相聯繫：將表單控制項作為標記標籤的內容，這樣的就是隱式形式，或為 標籤下的for 屬性命名一個目標表單id，這樣就是顯式形式。

例如，在XHTML 中：

明確的聯繫：

<label for="SSN">Social Security Number:</label>
<input type="text" name="SocSecNum" id="SSN" />

隱含的聯繫：

<label>Date of Birth: <input type="text" name="DofB" /></label>

第一個標記是以明確形式將文字"Social Security Number:" 和表單的社會安全號碼的文字輸入控制項("SocSecNum") 連結起來，它的for 屬性的值和控制項的id 一樣，都是SSN。第二個標記("Date of Birth:") 不需要for 屬性，它的相關控制項也不需要id 屬性，它們是透過在 標籤中放入 標籤來隱式地連接起來的。

瀏覽器支援：

所有主流瀏覽器都支援 for 屬性。

Safari 2 或更早的版本不支援 for 屬性。

HTML標籤的for 屬性語法：

<label for="value">

HTML標籤的for 屬性屬性值：

#element_id：label要綁定的元素的id.

【相關推薦】

html textarea是什麼意思？如何取得textarea標籤中的換行符和空格？

HTML5標籤是什麼意思？ HTML5標籤的基本用法詳解

以上是HTML label標籤是什麼意思？ HTML label標籤作用和屬性的用法實例的詳細內容。更多資訊請關注PHP中文網其他相關文章！