The <label> element is used to supply a visible text label to a form control. The text in the label element will help a user control the form component as if the text were part of the component. If not placed in a label tag, descriptive text associated with a form component would not be active or do anything besides be something to read.
Code ExampleThe id attribute of the input binds the label to it:
<p>Would you like to sign up for our newsletter?</p> <input type="checkbox" name="cb1" id="cb1" value="yes"> <label for="cb1">Yes sign me up</label>open in code editor You can also use the label element by wrapping it around a form component instead of targeting the form component using the "for" attribute. This example below creates a similar effect as the example above, but this time we nest the form component into our label element.
<p>Would you like to sign up for our newsletter?</p> <label> <input type="checkbox" name="cb1" value="yes"> Yes sign me up </label>open in code editor