Input Label

In the previous exercise, we created a text input. However, the user doesn't know what to enter in the input field because we haven't provided any description.

To label inputs, we use the label element. The label element has an opening and closing tag.

In order to associate the label with a specific input, we need to add the id attribute to the input with a unique value that identifies it. Then, we add the for attribute to the label element with a value corresponding to the id attribute of the input element.

<body>
	<form action="/exercise.html" method="POST">
		<label for="input-email">Email</label>
		<input type="text" name="email" id="input-email"/>
	</form>
</body>

This code will be displayed as follows:

Instructions

Add the id attribute with the value input-name to the input element.

Create a label element with the content Name before the input element.

Add the for attribute with the value input-name to the label element.

Start programming for free

4/9