Lesson 15 / 28

Input Types

The many faces of the input element.

type= changes everything

The same <input> tag renders differently based on type — text box, checkbox, date picker, and more.

<input type="text" placeholder="Name">
<input type="email" placeholder="Email">
<input type="password">
<input type="number" min="0" max="100">
<input type="date">
<input type="checkbox"> Subscribe
<input type="radio" name="plan"> Free

placeholder vs value

placeholder is faint hint text that disappears on typing; value is real pre-filled data that gets submitted.