How to define a label for an input element using HTML?
Last Updated :
19 Jun, 2024
Improve
To define a label for an input element in HTML5, use the <label>
tag. This tag enhances usability by allowing users to click on the label text to toggle the associated input control. The <label>
tag should include a for
attribute that matches the id
of the input element, ensuring a clear and accessible connection between the label and the input field.
Syntax:
<label> form content... </label>
Example: The example below shows how to define a label for an input element using HTML5.
<!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">
<h2>
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:
