在HTML中，<label> 标签定义了表单控件的标注。<label> 元素不会向用户呈现任何特殊效果，但它为鼠标用户改进了可用性。当用户单击与某个表单控件相关联的 <label> 元素时，浏览器会自动将焦点转移到该表单控件上。
语法
<label for="control_id">Label Text</label>
<input type="checkbox" id="control_id"> Checkbox label text
在这个例子中，for 属性的值应该与相关表单控件的 id 属性的值相同。这样，当用户点击标签文本时，浏览器会自动将焦点转移到对应的输入框上。
优势
-
增强可访问性：使用
<label>元素可以提高网页的无障碍性，因为屏幕阅读器等辅助技术可以将标签与相关的表单控件相关联。 -
增强用户体验：通过点击标签文本，用户可以直接激活或选择对应的表单控件，而不需要直接点击该控件。这对于使用触摸屏或有运动障碍的用户来说尤其有帮助。
注意事项
-
<label>元素应与相关的表单控件紧密相关，并且在可视上应该位于控件之前。这样可以确保当用户点击标签文本时，浏览器能够正确地将焦点转移到对应的输入框上。 -
如果您希望
<label>元素包含其他内容（例如图像或段落），请在表单控件周围使用该标签，而不是将它们作为子级嵌套在一起。这样可以确保当用户点击标签的任何部分时，都能够激活相关的表单控件。 -
您还可以通过将表单控件放置在
<label>元素内来达到相同的效果，但这种方法并不常见，因为它会使得文档结构更加复杂，并且对于某些类型的表单控件（例如单选按钮或复选框）可能会产生意外的行为。
示例
<form>
<label for="username">用户名:</label><br>
<input type="text" id="username" name="username"><br>
<label for="password">密码:</label><br>
<input type="password" id="password" name="password"><br>
<input type="submit" value="提交">
</form>
在这个例子中，每个输入框都与一个 <label> 元素相关联。当用户点击标签文本时，浏览器会自动将焦点转移到对应的输入框上。