HTML Forms Complete Tutorial

HTML Forms

Forms collect user input — logins, searches, signups. The <form> element wraps inputs and sends data to a server.

A Basic Form

<form action="/submit" method="POST">
  <label>Email:
    <input type="email" name="email" required>
  </label>
  <label>Password:
    <input type="password" name="password" minlength="8">
  </label>
  <button type="submit">Login</button>
</form>

Input Types

Type	Use
text / email / password	Text input
number / range	Numbers
checkbox / radio	Choices
date / time	Date pickers
file	Uploads

Built-in Validation

<input type="email" required>        <!-- must be email -->
<input type="text" minlength="3">    <!-- min characters -->
<input type="number" min="1" max="10">

FAQs

GET vs POST?

GET puts data in the URL (searches); POST sends it in the body (logins, sensitive data). More in our HTML guides.

How do I style forms?

With CSS — target inputs, labels, and :focus states.