Input Elements

Forms are one of main component of web. Because without of forms it will be hard to collect data from the user. And if want to create a good form so it is necessary to know basic input elements in HTML.

Whenever a user visits the website at that time to collect the user's information forms are used. These forms are created through different type of input elements which are following.

Button- Button is a push button, which activates after pushing it.
CheckBox- If you want to activate checkbox then you have to check it.
date- date is used to choose date.
Email- It is used to accept email from user.
file- It is used to upload a file.
Image- It is used to input a image
Color - It is used to choose the color of choice.
Month -It is used to input year and months in the format of YYYY-MM.
Number - It is used to input number.
Password - It defines the password field.
Radio - It is used to inputting a set of options
Range - Slide control interface with Default range is 0 to 100
Reset - Reset is used to reset the form.
Submit - Submit is used to submit the values of the form.
Text - It is used to enter the text in the form.

Syntax

The type attribute can be diffrent type which are mentioned above.

Example

If we want to create a input type of email then we can write in following way

<!DOCTYPE html>
<html>
<head>
    <title>Input Types in HTML</title>
</head>
<body>
    <h1> Input Types in HTML </h1>
    <input type="button">Button<br>
    <input type="checkbox">CheckBox<br>
    <input type="color">Color<br>
    <input type="date">Date<br>
    <input type="email" placeholder="Enter Your Mail"><br>
    <input type="file">File<br>
    <input type="image">Image<br>    
    <input type="month">Month<br>
    <input type="number" placeholder="Enter Your Age"><br>
    <input type="password">Password<br>
    <input type="radio">Click It<br>
    <input type="range">Enter the Range<br>
    <input type="reset">Reset form<br>
    <input type="search" placeholder="Search the word"><br>
    <input type="submit">Submit form<br>
    <input type="text" > Enter Text<br>
</body>
</html>

Input Elements

Table of contents

No headings in the article.