HTML Form Input Types
Discover the essential input types for creating powerful and user-friendly web forms.
Collecting User Data
Forms are essential for any interactive website. Let's learn about the most common input types to start collecting data from your users.
Input Type: 'text'
The default value. Creates a standard single-line text field. Perfect for usernames, subjects, and other short text entries.
Input Type: 'password'
Creates a text field where the typed characters are masked (shown as asterisks or dots). Essential for login forms to protect user privacy.
Input Type: 'email'
Creates a field specifically for email addresses. On most devices, it brings up a keyboard with the '@' symbol. Browsers may also perform simple validation to check for a valid email format.
Input Type: 'number'
Creates a field for entering numbers. Most browsers will display spinner controls to increment or decrement the value and may show a numeric keypad on mobile devices.
Practice Zone
Interactive Test 1: Drag & Drop
Arrastra en el orden correspondiente.
Arrastra las opciones:
Completa el código:
Interactive Test 2: Fill in the Blanks
Rellena los huecos en cada casilla.
<input type= placeholder="Enter your name"> <input type= placeholder="Enter your password"> <input type= placeholder="Enter your email"> <input type= placeholder="Enter a number">
Practice Example: Code Editor
Create a form that includes fields for name, email, password, number, and a submit button.