HTML中label标签的用法

<label>标签表示对某个元素的说明,可以和一些表单标签相关联,提升交互体验。

<label>经常用于和<input>元素相关联,例如:

<form action="form.php">
    <label for="dog">dog</label>
    <input type="radio" name="animal" id="dog" value="dog"><br>
    <label for="cat">cat</label>
    <input type="radio" name="animal" id="cat" value="cat"><br>
    <label for="pig">pig</label>
    <input type="radio" name="animal" id="pig" value="pig">
</form>

在本例中,三个<label>标签分别绑定了三个<input>标签,绑定后点击<label>标签也能联动对应的<input>标签。

绑定关系是通过<label>元素的for属性值和关联标签元素的id来实现的。

如果使用嵌套的写法,则可以省略<label>元素的for属性值和关联标签元素的id

<form action="form.php">
    <label>dog<input type="radio" name="animal" value="dog"></label><br>
    <label>cat<input type="radio" name="animal" value="cat"></label><br>
    <label>pig<input type="radio" name="animal" value="pig"></label>
</form>