Forms & Inputs
HTML <input> Tag
The <input> tag specifies an input field where the user can enter data.
Definition and Usage
The <input> tag specifies an input field where the user can enter data.
Standard Syntax:
<input>Interactive ExampleRunnable
HTML <input> Example
htmlLive code demonstration for the <input> tag. Click "Try it Yourself" to edit and experiment in real time.
<div style="font-family: system-ui, sans-serif; padding: 16px; background: #ffffff; border-radius: 8px; border: 1px solid #e2e8f0; color: #0f172a;">
<form
action="/action_page.php">
<label for="fname">First name:</label>
<input type="text"
id="fname" name="fname"><br><br>
<label for="lname">Last name:</label>
<input type="text"
id="lname" name="lname"><br><br>
<input type="submit" value="Submit">
</form>
</div>Attributes for <input>
32 Supported Attributes| Attribute | Values | Default | Description |
|---|---|---|---|
| accept | file_extension audio/* video/* image/* media_type | none | Specifies a filter for what file types the user can pick from the file input dialog box (only for type="file") |
| alt | text | none | Specifies an alternate text for images (only for type="image") |
| autocomplete | on off | none | Specifies whether an <input> element should have autocomplete enabled |
| autofocus | autofocus | none | Specifies that an <input> element should automatically get focus when the page loads |
| checked | checked | none | Specifies that an <input> element should be pre-selected when the page loads (for type="checkbox" or type="radio") |
| dirname | inputname.dir | none | Specifies that the text direction will be submitted |
| disabled | disabled | none | Specifies that an <input> element should be disabled |
| form | form_id | none | Specifies the form the <input> element belongs to |
| formaction | URL | none | 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 | none | Specifies how the form-data should be encoded when submitting it to the server (for type="submit" and type="image") |
| formmethod | getpost | none | Defines the HTTP method for sending data to the action URL (for type="submit" and type="image") |
| formnovalidate | formnovalidate | none | Defines that form elements should not be validated when submitted |
| formtarget | _blank _self _parent _top framename | none | Specifies where to display the response that is received after submitting the form (for type="submit" and type="image") |
| height | pixels | none | Specifies the height of an <input> element (only for type="image") |
| list | datalist_id | none | Refers to a <datalist> element that contains pre-defined options for an <input> element |
| max | number date | none | Specifies the maximum value for an <input> element |
| maxlength | number | none | Specifies the maximum number of characters allowed in an <input> element |
| min | number date | none | Specifies a minimum value for an <input> element |
| minlength | number | none | Specifies the minimum number of characters required in an <input> element |
| multiple | multiple | none | Specifies that a user can enter more than one value in an <input> element |
| name | text | none | Specifies the name of an <input> element |
| pattern | regexp | none | Specifies a regular expression that an <input> element's value is checked against |
| placeholder | text | none | Specifies a short hint that describes the expected value of an <input> element |
| popovertarget | element_id | none | Specifies which popover element to invoke (only for type="button") |
| popovertargetaction | hideshowtoggle | none | Specifies what happens to the popover element when you click the button (only for type="button") |
| readonly | readonly | none | Specifies that an input field is read-only |
| required | required | none | Specifies that an input field must be filled out before submitting the form |
| size | number | none | Specifies the width, in characters, of an <input> element |
| src | URL | none | Specifies the URL of the image to use as a submit button (only for type="image") |
| step | numberany | none | Specifies the interval between legal numbers in an input field |
| type | button checkbox color date datetime-local email file hidden image month number password radio range reset search submit tel text time url week | none | Specifies the type <input> element to display |
| width | pixels | none | Specifies the width of an <input> element (only for type="image") |
Global Attributes
The <input> tag also supports the standard global attributes in HTML, including class, id, style, title, hidden, and data-*.
Event Attributes
The <input> tag supports event attributes in HTML, such as onclick, onmouseover, onfocus, and more.
Browser Compatibility
ChromeEdgeFirefoxSafariOpera
More Tags in Forms & Inputs
View All 123Tags →<button>The <button> tag defines a clickable button.<datalist>The <datalist> tag specifies a list of pre-defined options for an <input> element.<fieldset>The <fieldset> tag is used to group related elements in a form.<form>The <form> tag is used to create an HTML form for user input.<label>The <label> tag defines a label for several elements:<legend>The <legend> tag defines a caption for the <fieldset> element.