HTML <input>Tag
Examples
A simple HTML form with two text input fields and a submit button:
<form action="demo_form.php">
First name: <input type="text" name="fname"><br>
Last name: <input type="text" name="lname"><br>
<input type="submit" value="Submit">
</form>
Try it Yourself »
(More examples can be found at the bottom of this page.)
Browser Support
| Element | |||||
|---|---|---|---|---|---|
| <input> | Yes | Yes | Yes | Yes | Yes |
Definition and Usage
The <input> tag specifies an input field where the user can enter data.
The <input> element is used in a <form> element to declare input controls that allow users to input data.
The input field can be changed in many ways, depending on the type attribute.
Tips and Notes
Note:The <input> element is empty; it contains only attributes.
Tip:You can use the<label><label> element to define a label for the <input> element.
Differences between HTML 4.01 and HTML5
In HTML 4.01, the "align" attribute is no longer used. HTML5 does not support this attribute. CSS can be used to define the alignment of the <input> element.
In HTML5, several attributes were added to <input>, along with corresponding values.
Differences between HTML and XHTML
In HTML, the <input> tag has no closing tag.
In XHTML, the <input> tag must be properly closed.
Attributes
New: New in HTML5.
| Attribute | Value | Description |
|---|---|---|
| accept | audio/* video/* image/* MIME_type | Specifies the type of file to submit through file upload. (Only for type="file") |
| align | left right top middle bottom | Deprecated in HTML5, not recommended. Specifies the alignment of the image input. (Only for type="image") |
| alt | text | Defines the alternative text for the image input. (Only for type="image") |
| autocompleteNew | on off | The autocomplete attribute specifies whether the input field of the <input> element should have autocomplete enabled. |
| autofocusNew | autofocus | The attribute specifies that the <input> element should automatically get focus when the page loads. |
| checked | checked | The checked attribute specifies that the <input> element should be preselected when the page loads. (Only for type="checkbox" or type="radio") |
| disabled | disabled | The disabled attribute specifies that the <input> element should be disabled. |
| formNew | form_id | The form attribute specifies one or more forms to which the <input> element belongs. |
| formactionNew | URL | The attribute specifies the URL of the file that processes the input control when the form is submitted. (Only for type="submit" and type="image") |
| formenctypeNew | application/x-www-form-urlencoded multipart/form-data text/plain | The attribute specifies how the form data should be encoded when submitted to the server. (Only for type="submit" and type="image") |
| formmethodNew | get post | Defines the HTTP method for sending form data to the action URL. (Only for type="submit" and type="image") |
| formnovalidateNew | formnovalidate | The formnovalidate attribute overrides the novalidate attribute of the <form> element. |
| formtargetNew | _blank _self _parent _top framename | Specifies the name or keyword indicating where to display the response after submitting the form. (Only for type="submit" and type="image") |
| heightNew | pixels | Specifies the height of the <input> element. (Only for type="image") |
| listNew | datalist_id | The attribute references the <datalist> element, which contains predefined options for the <input> element. |
| maxNew | number date | The attribute specifies the maximum value of the <input> element. |
| maxlength | number | The attribute specifies the maximum number of characters allowed in the <input> element. |
| minNew | number date | The attribute specifies the minimum value of the <input> element. |
| multipleNew | multiple | The attribute specifies multiple values that the user can enter into the <input> element. |
| name | text | The name attribute specifies the name of the <input> element. |
| patternNew | regexp | The pattern attribute specifies a regular expression used to validate the value of the <input> element. |
| placeholderNew | text | The placeholder attribute specifies a short hint that describes the expected value of the <input> field. |
| readonly | readonly | The readonly attribute specifies that the input field is read-only. |
| requiredNew | required | The attribute specifies that the input field must be filled out before submitting the form. |
| size | number | The size attribute specifies the visible width of the <input> element in characters. |
| src | URL | The src attribute specifies the URL of the image displayed as a submit button. (Only for type="image") |
| stepNew | number | The step attribute specifies the legal number intervals for the <input> element. |
| type | button
checkbox color date datetime datetime-local file hidden image month number password radio range reset search submit tel text time url week |
The type attribute specifies the type of <input> element to display. |
| value | text | Specifies the value of the <input> element. |
| widthNew | pixels | The width attribute specifies the width of the <input> element. (Only for type="image") |
Global Attributes
The <input> tag supports global attributes, view the full attribute tableHTML Global Attributes。
Event Attributes
The <input> tag supports allHTML Event Attributes。
Other Extensions