<label> 标签用于为表单元素定义标签(标签文本),提高表单的可访问性,并使用户更容易与表单元素交互。以下是 <label> 标签的基本结构:
<label for="input_id">标签文本:</label>
<input type="text" id="input_id" name="input_name">

在这个例子中:

  •  for: 通过 for 属性,<label> 标签与相应的表单元素建立关联。for 属性的值应该是关联表单元素的 id。

  •  <label> 内的文本是用户看到的标签文本。


使用 <label> 的好处在于,用户可以点击标签文本来聚焦(focus)关联的表单元素,而不仅仅是点击实际的表单元素。这对于提高可访问性和用户体验非常重要。

示例:
<form>
  <label for="username">用户名:</label>
  <input type="text" id="username" name="username"><br><br>

  <label for="password">密码:</label>
  <input type="password" id="password" name="password"><br><br>

  <input type="submit" value="提交">
</form>

在这个例子中,每个输入字段前面都有一个关联的 <label>,使得用户在点击标签文本时能够焦点到相应的输入框。这有助于提高表单的可用性。


转载请注明出处:http://www.zyzy.cn/article/detail/3744/HTML5