HTML label 标签使用

点击 标签通常会使与之关联的表单控件获得焦点或被激活。
通过正确使用 标签,可以使表单更加友好和易于使用,同时提高整体的可访问性。

基本用法

标签通过 for 属性与 id 为 username 的 元素关联。当用户点击“用户名:”这个标签时,关联的输入框会自动获得焦点。

<label for="username">用户名:label>
<input type="text" id="username" name="username">

直接嵌套

标签还可以直接包含表单控件,这种方式下无需使用 for 属性和 id 属性。

<label>
  邮箱:
  <input type="email" name="email">
label>

在这种情况下,点击“邮箱:”文本或文本框的任何部分都会激活文本框。

关联复选框和单选框

<label>
    <input type="checkbox" name="subscribe" value="newsletter">
    订阅新闻
label>
<br>
性别:      
<input type="radio" name="sex" checked="checked" id="man" />
<label for="man">label>
<input type="radio" name="sex" id="woman" />
<label for="woman">label>	

HTML label 标签使用_第1张图片

你可能感兴趣的:(网页设计,前端)