0Pricing
HTML Academy · Lesson

Input Types text password email number tel

Use the right input type for each data field.

The input Element

The <input> element creates various form controls. The type attribute determines what kind:

<input type="text">      <!-- single-line text -->
<input type="password"> <!-- masked text -->
<input type="email">    <!-- email address -->
<input type="number">   <!-- numeric -->
<input type="tel">      <!-- phone number -->

type=text

The default input type — a single-line text field:

<label for="username">Username</label>
<input
  type="text"
  id="username"
  name="username"
  placeholder="e.g. jane_doe"
  maxlength="50"
  autocomplete="username"
>

All lessons in this course

  1. The form Element action method enctype
  2. Input Types text password email number tel
  3. The label Element and Accessibility
  4. The button Element submit reset button
← Back to HTML Academy