HTML <input> Tag
Example
An HTML form with three input fields; two text fields and one submit button:
<form
action="/action_page.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 »Definition and Usage
The <input> tag specifies an input field where the user can enter data.
<input> elements are used within a <form> element to declare input controls that allow users to input data.
An input field can vary in many ways, depending on the type attribute.
Browser Support
| Element | |||||
|---|---|---|---|---|---|
| <input> | Yes | Yes | Yes | Yes | Yes |
Tips and Notes
Note: The <input> element is empty, it contains attributes only.
Tip: Use the <label> element to define labels for <input> elements.
Differences Between HTML 4.01 and HTML5
The "align" attribute is not supported in HTML5.
In HTML5, the <input> tag has several new attributes, and the type attribute has several new values.
Differences Between HTML and XHTML
In HTML, the <input> tag has no end tag.
In XHTML, the <input> tag must be properly closed, like this <input />.
Attributes
| Attribute | Value | Description |
|---|---|---|
| accept | file_extension audio/* video/* image/* media_type |
Specifies a filter for what file types the user can pick from the file input dialog box (only for type="file") |
| align | left right top middle bottom |
Not supported in HTML5. Specifies the alignment of an image input (only for type="image") |
| alt | text | Specifies an alternate text for images (only for type="image") |
| autocomplete | on off |
Specifies whether an <input> element should have autocomplete enabled |
| autofocus | autofocus | Specifies that an <input> element should automatically get focus when the page loads |
| checked | checked | Specifies that an <input> element should be pre-selected when the page loads (for type="checkbox" or type="radio") |
| dirname | inputname.dir | Specifies that the text direction will be submitted |
| disabled | disabled | Specifies that an <input> element should be disabled |
| form | form_id | Specifies the form the <input> element belongs to |
| formaction | URL | Specifies the URL of the file that will process the input control when the form is submitted (for type="submit" and type="image") |
| formenctype | application/x-www-form-urlencoded multipart/form-data text/plain |
Specifies how the form-data should be encoded when submitting it to the server (for type="submit" and type="image") |
| formmethod | get post |
Defines the HTTP method for sending data to the action URL (for type="submit" and type="image") |
| formnovalidate | formnovalidate | Defines that form elements should not be validated when submitted |
| formtarget | _blank _self _parent _top framename |
Specifies where to display the response that is received after submitting the form (for type="submit" and type="image") |
| height | pixels | Specifies the height of an <input> element (only for type="image") |
| list | datalist_id | Refers to a <datalist> element that contains pre-defined options for an <input> element |
| max | number date |
Specifies the maximum value for an <input> element |
| maxlength | number | Specifies the maximum number of characters allowed in an <input> element |
| min | number date |
Specifies a minimum value for an <input> element |
| multiple | multiple | Specifies that a user can enter more than one value in an <input> element |
| name | text | Specifies the name of an <input> element |
| pattern | regexp | Specifies a regular expression that an <input> element's value is checked against |
| placeholder | text | Specifies a short hint that describes the expected value of an <input> element |
| readonly | readonly | Specifies that an input field is read-only |
| required | required | Specifies that an input field must be filled out before submitting the form |
| size | number | Specifies the width, in characters, of an <input> element |
| src | URL | Specifies the URL of the image to use as a submit button (only for type="image") |
| step |
number any |
Specifies the interval between legal numbers in an input field |
| type | button checkbox color date datetime-local file hidden image month number password radio range reset search submit tel text time url week |
Specifies the type <input> element to display |
| value | text | Specifies the value of an <input> element |
| width | pixels | Specifies the width of an <input> element (only for type="image") |
Global Attributes
The <input> tag also supports the Global Attributes in HTML.
Event Attributes
The <input> tag also supports the Event Attributes in HTML.
Related Pages
HTML tutorial: HTML Forms
HTML DOM reference:
- Input Button Object
- Input Checkbox Object
- Input Color Object
- Input Date Object
- Input Datetime Object
- Input DatetimeLocal Object
- Input Email Object
- Input FileUpload Object
- Input Hidden Object
- Input Image Object
- Input Month Object
- Input Number Object
- Input Password Object
- Input Range Object
- Input Radio Object
- Input Reset Object
- Input Search Object
- Input Submit Object
- Input Text Object
- Input Time Object
- Input URL Object
- Input Week Object
Default CSS Settings
None.
