: The INPUT Element
Last updated: 2026-09-12
<input>The INPUT Element
The <input> element is the most common form control, creating various input fields. The type attribute switches between text, password, checkbox, radio, date pickers and more. It's a void element.
| Category | Forms |
|---|---|
| Content Model | None (void element) |
| Allowed Parents | Any element that accepts phrasing content, usually inside <form> |
| Content Tag | Self-closing — no closing tag needed |
| Status | Standard |
📝 Syntax
<input type="text" name="field-name" placeholder="placeholder text">⚙️ Attributes
This element supports the global attributes plus the following:
| Attribute | Value | Description |
|---|---|---|
type | Keyword | The type of the input, determines the control's form.
|
name | Text | The field name submitted with the form; groups radio buttons. |
value | Text | The current or default value. |
placeholder | Text | Hint text shown when the field is empty. |
required | Boolean | Marks the field as required. |
disabled | Boolean | Disables the field; not submitted. |
readonly | Boolean | Read-only; visible but not editable. |
maxlength | Number | Maximum number of characters. |
checked | Boolean | Default checked state for checkbox/radio. |
▶ Example
Edit the code below and see the live result in the playground:
🌐 Browser Support
| Browser |  Chrome |
 Edge |
 Firefox |
 Safari |
 Opera |
|---|---|---|---|---|---|
| <input> | ✓ v1 | ✓ v12 | ✓ v1 | ✓ v1 | ✓ v1 |
| Supported in all major browsers | |||||
Tip： Always set the name attribute, otherwise the field's value won't be submitted.
🏷️ Related Tags
💡 Related Cases
📚 Related Tutorials
