About Label

suggest change

The <label> element is used to reference a form action element.

In the scope of User Interface it’s used to ease the target / selection of elements like Type radio or checkbox.

<label> as wrapper

It can enclose the desired action element

    <input type="checkbox" name="Cats">
    I like Cats!

(Clicking on the text the target input will toggle it’s state / value)

<label> as reference

Using the for attribute you don’t have to place the control element as descendant of label - but the for value must match it’s ID

<input id="cats" type="checkbox" name="Cats">
<label for="cats" >I like Cats!</label>


Don’t use more than one Control Element within a <label> element

Feedback about page:

Optional: your email if you want me to get back to you:

Table Of Contents