Collect user input with the form element.
✍️ 3 exercises + code challenge in this lessonAn HTML form collects user input, which is usually sent to a server for processing.
<form> wraps the form controls.<label> describes a field; its for attribute matches the field's id.<input> is the most common field; its type decides how it behaves.name attribute is the key used when the data is sent. A field without a name is not submitted.Mastering HTML Forms helps you write clean and reliable HTML code. Follow standard conventions, test edge cases, and keep logic simple. Try running the code example below and complete the exercises to build confidence.
<form onsubmit="alert('Welcome, ' + this.fname.value + ' ' + this.lname.value + '!'); return false;">
<label for="fname">First name:</label><br>
<input type="text" id="fname" name="fname" value="Ali"><br><br>
<label for="lname">Last name:</label><br>
<input type="text" id="lname" name="lname" value="Khan"><br><br>
<input type="submit" value="Submit">
</form>Check what you learned in “HTML Forms”.
Connect the label to the input.
<label ="email">Email</label> <input id="email" name="email">
Which attribute must an input have to be sent with the form?
Create a form with a text input named "username" and a submit button.
Free sign-in required · Google login available
Stuck on something?
Ask the community in the CodesInTech forum.
Need a developer?
Learning on your own is great — and when you need professional help, our team builds custom software, websites and mobile apps for clients worldwide.
Explore Our Services