HTML <label> Tag: The HTML label tag is used to provide a usability improvement for mouse users i.e if a users clicks on the text within the <label> element, it toggles the control. The HTML<label>tag specifies label for a <button>, <output>, <meter>, <input> elements.
HTML <label> Tag
This HTML label tag supports both the global and the event attributes.
Syntax: <label>Text</label>
The <label> tag can be used in two ways:
- Firstly, use <label> tag by providing the <input> and id attribute. The <label> tag needs a attribute whose value is same as input id.
- Alternatively, <input> tag use directly inside the <label> tag. In this case, the for and id attributes are not needed because the association is implicit.
Browser compatibility
The HTML<label>tag is supported by different types of browsers.
- Chrome
- Firefox
- Opera
- Safari
- Internet Explorer
Example:
<!DOCTYPE html> <html> <body> <p>Select your state:</p> <form action="/action_page.php"> <label for="Andhra Pradesh">Andhra Pradesh</label> <input type="radio" name="state" id="Andhra Pradesh" value="Andhra Pradesh"><br> <label for="Telangana">Telangana</label> <input type="radio" name="state" id="Telangana" value="Telangana"><br> <label for="other">Other</label> <input type="radio" name="state" id="other" value="other"><br><br> <input type="submit" value="Submit"> </form> </body> </html>
Output:
Attributes supported by the <label> tag
| Attribute | Value | Description |
|---|---|---|
| for | element_id | Specifies which form element a label is bound to |