html label標籤怎麼用-前端問答-PHP中文網

首頁

web前端

前端問答

html label標籤怎麼用

青灯夜游

May 27, 2019 pm 01:24 PM

html label標籤

html label標籤用於為 input 元素定義標註（標記）；label 元素不會向使用者呈現任何特殊效果。不過，它為滑鼠使用者改進了可用性；當使用者選擇該標籤時，瀏覽器就會自動將焦點轉到和標籤相關的表單控制項上。

html label標籤怎麼用

html label標籤怎麼用？

作用：為 input 元素定義標註（標記）。

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

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

html label標籤範例1：

<!DOCTYPE HTML>
<html>
<head>
	<meta charset="UTF-8">
</head>
<body>
<p>请点击文本标记之一，就可以触发相关控件：</p>
<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>
</body>
</html>

登入後複製

效果圖：

html label標籤怎麼用

html label標籤範例2：

<!DOCTYPE HTML>
<html>
<head>
	<meta charset="UTF-8">
</head>
<body>
<p>点击文本，就可以触发相关控件：</p>
<form>
<label for="male">Male</label>
<input type="text" id="male" />
<br />
<label for="female">Female</label>
<input type="text" id="female" />
</form>
</body>
</html>

登入後複製

效果圖：

html label標籤怎麼用