In this article, we will learn how to define a label for an input element by using a <label> tag. It is used to provide a usability improvement for mouse users i.e. if a user clicks on the text within the label element, it toggles the control. The label tag defines the label for the button or text area element.
Syntax:
<label> form content... </label>
Example:
<!DOCTYPE html> < html >
< head >
< title >
Define a label for
an input element
</ title >
< style >
body {
font-size: 20px;
}
</ style >
</ head >
< body style = "text-align:center" >
< h1 style = "color:green" >
GeeksforGeeks
</ h1 >
< h2 >
HTML5: How to define a label
for an input element?
</ h2 >
< form >
<!-- Starts label tag from here -->
< label for = "student" >
Student
</ label >
< input type = "radio" name = "Occupation" id = "student" value = "student" >< br >
< label for = "business" >
Business
</ label >
< input type = "radio" name = "Occupation" id = "business" value = "business" >< br >
< label for = "other" >
Other
</ label >
<!-- Ends label tags here -->
< input type = "radio" name = "Occupation"
id = "other" value = "other" >
</ form >
</ body >
</ html >
|
Output:
Supported Browsers:
- Google Chrome
- Internet Explorer
- Firefox
- Opera
- Safari