CSS ::placeholder Selector
Example
Change the color of the placeholder text of an input field:
::-webkit-input-placeholder
{ /* Edge */
color: red;
}
:-ms-input-placeholder
{ /* Internet Explorer 10-11 */
color: red;
}
::placeholder
{
color: red;
}
Try it Yourself »
Definition and Usage
The ::placeholder
selector selects form elements with placeholder text.
The placeholder text is set with the placeholder attribute, which specifies a hint that describes the expected value of an input field.
Tip: The default color of the placeholder text is light grey in most browsers.
Browser Support
The numbers in the table specify the first browser version that fully supports the selector.
Numbers followed by -webkit-, -moz- or -ms- specify the first version that worked with a prefix.
Selector | |||||
---|---|---|---|---|---|
::placeholder | 57.0 4.0 -webkit- |
12.0 -webkit- 10.0 -ms- |
51.0 4.0 -moz- |
10.1 5.0 -webkit- |
44.0 15.0 -webkit- |
CSS Syntax
::placeholder {
css declarations;
}