HTML <input> (Input Form Control) Tag
Example
<form action="action.php">
<label for="fname">First name:</label>
<input type="text" id="fname" name="fname"><br>
<label for="lname">Last name:</label>
<input type="text" id="lname" name="lname"><br>
<input type="submit" value="Submit">
</form>
Meaning
The <input> element specifies an input control for a form.
The <input> element is one of the most powerful and complex in all of HTML due to the lots of combinations of input types and attributes.
See input typesVersion: HTML 2, 3.2, 4, 4.01, 5
Standard Syntax
HTML:<input>,
XHTML:<input />
Browser Support
Status
Attributes
Attribute | Value | Type | Description |
---|---|---|---|
accept | fileExtension audio/* video/* image/* mediaType |
file | Defines expected file type in file upload controls. |
alt | text | image | alt attribute for the image type. Required for accessibility |
autocomplete | on|off | all | Hint for form autofill feature |
autofocus | autofocus | all (except hidden) | Automatically focus the form control when the page is loaded. |
capture | user|environment | file | Media capture input method in file upload controls. |
checked | checked | radio, checkbox | Specifies Whether the command or control is checked. |
dirname | inputname.dir | text, search | Name of form field to use for sending the element's directionality in form submission |
disabled | disabled | all | Whether the form control is disabled |
form | formId | all | Associates the control with a form element. |
formaction | URL | image, submit | Defines URL to use for form submission. |
formenctype | application/x-www-form-urlencoded multipart/form-data text/plain |
image, submit | Form data set encoding type to use for form submission. |
formmethod | get post |
image, submit | Defines HTTP method to use for form submission. |
formnovalidate | formnovalidate | image, submit | Bypass form control validation for form submission. |
formtarget | _self _blank _parent _top frameName |
image, submit | Defines browsing context for form submission(response). |
height | pixels | image | Specifies the height of an <input> element. |
inputmode | none text tel url numeric decimal search |
almost all | It provides a hint to browsers as to the type of virtual keyboard configuration to use when editing this element or its contents. |
list | datalistId | almost all | Specifies the id of the datalist to provides a list of predefined values to the <input> element. |
max | number date |
numeric types | Specifies maximum value/date. |
maxlength | number | password, search, tel, text, url | Maximum length (number of characters) of value. |
min | number date |
numeric types | Specifies minimum value/date. |
minlength | number | password, search, tel, text, url | Minimum length (number of characters) of value. |
multiple | multiple | email, file | Its a boolean attribute. Whether to allow multiple values. |
name | all | Name of the form control. Submitted with the form as part of a name/value pair. | |
pattern | regexp | password, text, tel | Specifies a regular expression the value must match to be valid. |
placeholder | text | password, search, tel, text, url | Text that appears in the form control when it has no value specified. |
readonly | readonly | almost all | Its a boolean attribute. The value is not editable |
required | required | almost all | It's a boolean attribute. A value is required or must be check for the form to be submittable. |
size | number | email, password, tel, text | Specifies the size of the input field. |
scr | URL | image | Specifies source url for input field. |
step | number | numeric types | Incremental values that are valid. |
type | button checkbox color date datetime-local file hidden image month number password radio range reset search submit tel text time url week |
all | Type of form control |
value | text | all | The initial value of the control. |
width | pixels | image | Specifies the width of an <input> element. |
Global Attributes
<input> element also supports the Global Attributes in HTML.
Event Attributes
<input> element also supports the Event Attributes in HTML.
By Default CSS Value(s)
None