HTML placeholder Attribute
Definition and Usage
The placeholder attribute specifies a short hint that describes the expected value
of a input field / textarea.
The short hint is displayed in the field before the user enters a value.
Applies to
The placeholder attribute can be used on the following elements:
| Elements | Attribute |
|---|---|
| <input> | placeholder |
| <textarea> | placeholder |
Examples
Input Example
Two input fields with a placeholder text:
<form action="/action_page.php">
<label for="phone">Enter a phone
number:</label><br><br>
<input type="tel" id="phone" name="phone"
placeholder="123-45-678" pattern="[0-9]{3}-[0-9]{2}-[0-9]{3}"><br><br>
<small>Format: 123-45-678</small><br><br>
<input type="submit">
</form>
Try it Yourself »
Textarea Example
A text area with a placeholder text:
<textarea placeholder="Describe yourself here..."></textarea>
Try it Yourself »
Browser Support
The placeholder attribute has the following browser support for each element:
| Element | |||||
|---|---|---|---|---|---|
| input | 10.0 | 10.0 | 4.0 | 5.0 | 11.0 |
| textarea | Yes | 10.0 | 4.0 | 5.0 | 11.5 |
