Input Element Attribute
Type Attribute
Hidden:
<input type="hidden">
Text:
<input type="text">
Email:
<input type="email">
Password:
<input type="password">
Date:
<input type="date">
Month:
<input type="month">
Week:
<input type="week">
Time:
<input type="time">
Number:
<input type="number">
Radio:
<input type="radio">
Radio:
<input type="radio" checked>
with checked
Checkbox:
<input type="checkbox">
Checkbox:
<input type="checkbox" checked>
with checked
Submit:
<input type="submit">
Reset:
<input type="reset">
Button:
<input type="button">
Range:
<input type="range">
File:
<input type="file">
File:
<input type="file" multiple>
with multiple file selection
Color:
<input type="color">
Image:
<input type="image">
Search:
<input type="search">
Tel:
<input type="tel">
Url:
<input type="url">
Placeholder Attribute
Text:
<input type="text">
Text:
<input type="text" value="Neelesh" >
Text:
<input type="text"
placeholder
="Enter name here" >
Autofocus Attribute
<input type="text" placeholder="at least 3 characters">
<input type="text"
autofocus
>
It is a Boolean attribute Specifies that an <input> element should automatically get focus when the page loads
Some more input Elements
ReadOnly Text:
<input type="text" value="admin@kosamkheda.com"
readonly
>
Disable Text:
<input type="text" value="Neelesh"
disabled
>
Dropdown box:
Bhopal
Mumbai
<select>
<option>Bhopal</option>
<option>Mumbai</option>
</select>
Dropdown box:
Bhopal
Mumbai
with default selection
<select>
<option>Bhopal</option>
<option
selected
>Mumbai</option>
</select>
List box:
Bhopal
Mumbai
<select
multiple
>
<option>Bhopal</option>
<option>Mumbai</option>
</select>
Textarea
#101,15Cross,2Dain,Kormangala Bangaluru
<textarea name="address" rows="5" cols="30">
#101,15Cross,2Main,Kormangala Bangaluru
</textarea>
Textarea
#101,15Cross,2Dain,Kormangala Bangaluru
<textarea name="address" rows="5" cols="30"
style="resize:none;"
>
#101,15Cross,2Main,Kormangala Bangaluru
</textarea>
Datalist
<input list="browsers">
<datalist id="browsers">
<option value="Internet Explorer">
<option value="Firefox">
<option value="Chrome">
</datalist >
Lable
Male
Fmale
<label
for="male"
>Male</label>
<input type="radio" name="gender"
id="male"
value="male" >
<label
for="female"
>Female</label>
<input type="radio" name="gender"
id="female"
value="female" >
Without-Lable :
Male
Fmale
Male <input type="radio" name="gender" id="male" value="male" >
Female <input type="radio" name="gender" id="female" value="female" >
© kosamkheda.com