::placeholder CSS pseudo-element
The ::placeholder pseudo-element represents placeholder text in an input field: text that represents the input and provides a hint to the user on how to fill out the form. For example, a date-input field might have the placeholder text YYYY/MM/DD
to clarify that numeric dates are to be entered in year-month-day order.
IE | Edge | Firefox | Chrome | Safari | Opera | iOS Safari | Opera Mini | Android Browser | Blackberry Browser | Opera Mobile | Chrome for Android | Firefox for Android | IE Mobile | UC Browser for Android | Samsung Internet | QQ Browser | Baidu Browser |
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
49webkit |
|||||||||||||||||
56webkit |
9.3webkit |
4.4webkit |
|||||||||||||||
14ms |
52 | 57 | 10webkit |
10.0-10.2webkit |
4.4.3-4.4.4webkit |
4webkit |
|||||||||||
11ms |
15ms |
53 | 58 | 10.1 | 44 | 10.3 | all | 56webkit |
10webkit |
37o |
57 | 52 | 11ms |
11.4webkit |
5webkit |
1.2webkit |
7.12 |
54 | 59 | TP | 45 | ||||||||||||||
55 | 60 | 46 | |||||||||||||||
56 | 61 |
Notes
Partial support refers to using alternate names:
::-webkit-input-placeholder
for Chrome/Safari/Opera (Chrome issue #623345)
:-ms-input-placeholder
for IE.
::-ms-input-placeholder
for Edge (also supports webkit prefix)
-
1
Firefox 18 and below supported the
:-moz-placeholder
pseudo-class rather than the::-moz-placeholder
pseudo-element.