HTML Input Types
HTML Input Types:
Purpose:
Control what kind of information users can enter into form fields.
Key
element: <input> tag with its type attribute specifying the input type.
Common Input Types:
text:
General
text input (default).
Example:
<input
type=”text” name=”username”>
password:
Masks
entered characters for security.
Example:
<input type=”password”
name=”password”>
email:
Validates
email format.
Example:
<input
type=”email” name=”email”>
number:
Accepts numerical input.
Example:
<input
type=”number” name=”age”>
checkbox:
Multiple
choices (can select one or more).
Example:
<input type=”checkbox”
name=”interests” value=”music”>
radio:
Single
choice (can select only one).
Example:
<input
type=”radio” name=”gender” value=”male”>
submit:
Creates a
button to submit the form.
Example:
<input
type=”submit” value=”Submit”>
Other Useful Input Types:
date:
Select a
date.
Example:
<input type=”date”
name=”birthday”>
time:
Select a
time.
Example:
<input
type=”time” name=”meetingTime”>
url:
Validates
URL format.
Example:
<input
type=”url” name=”website”>
search:
Text input
for search queries.
Example:
<input
type=”search” name=”searchTerm”>
tel:
Optimized
for telephone numbers.
Example:
<input
type=”tel” name=”phone”>
range:
Numerical
input with a slider.
Example:
<input
type=”range” name=”volume” min=”0″
max=”10″>
Example:
Output: