Scribd
Upload
8 views2 pages

HTML Input Types With Output

The document outlines various HTML input types categorized into text-based, number and date, boolean/choice, file and hidden, and special inputs, along with their descriptions. It includes an example HTML form demonstrating the use of these input types. The output description explains the functionality of the form elements and how users can interact with them.

Uploaded by

gautam.jetti9
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
8 views2 pages

HTML Input Types With Output

The document outlines various HTML input types categorized into text-based, number and date, boolean/choice, file and hidden, and special inputs, along with their descriptions. It includes an example HTML form demonstrating the use of these input types. The output description explains the functionality of the form elements and how users can interact with them.

Uploaded by

gautam.jetti9
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 2

HTML Input Types with Output Example

Text-based Inputs
Input Type Description

text Single-line plain text input

password Input that hides the characters entered

email Validates email address format

search Input optimized for search

tel Telephone number input

url Validates URL format

Number and Date Inputs


Input Type Description

number Numeric input with optional min/max

range Slider to select a number within a range

date Selects a date

month Selects a month and year

week Selects a week number

time Selects a time (hour and minutes)

datetime-local Selects date and time (no timezone)

Boolean/Choice Inputs
Input Type Description

checkbox Allows multiple selections

radio Allows single selection in a group

submit Submits the form

reset Resets form inputs to default values

button General-purpose button


HTML Input Types with Output Example

File and Hidden Inputs


Input Type Description

file Uploads files

hidden Hidden from user, used for backend values

Special Inputs
Input Type Description

color Color picker input

image Submit button in the form of an image

Example HTML Form Code:


<form>
<input type="text" placeholder="Name"><br>
<input type="email" placeholder="Email"><br>
<input type="password" placeholder="Password"><br>
<input type="number" min="1" max="100"><br>
<input type="range" min="0" max="10"><br>
<input type="date"><br>
<input type="checkbox"> Accept Terms<br>
<input type="radio" name="gender" value="male"> Male
<input type="radio" name="gender" value="female"> Female<br>
<input type="file"><br>
<input type="color"><br>
<input type="submit">
</form>

Output Description:
- Displays form elements including text, email, password, number, range slider, and
more.
- Users can interact and input values.
- Submit button sends form data to the server (if action is defined).

You might also like