WebKit, Blink (Safari, Google Chrome, Opera 15+) and Microsoft Edge are using a pseudo-element: ex- ::-webkit-input-placeholder.
Mozilla Firefox 4 to 18 is using a pseudo-class: :-moz-placeholder (one colon). ex- :-moz-placeholder
Mozilla Firefox 19+ is using a pseudo-element: ::-moz-placeholder, but the old selector will still work for a while. ex- ::-moz-placeholder
Internet Explorer 10 and 11 are using a pseudo-class: :-ms-input-placeholder. ex- :-ms-input-placeholder
Internet Explorer 9 and lower does not support the placeholder attribute.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
::-webkit-input-placeholder { /* WebKit, Blink, Edge */
color: #909;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
color: #909;
opacity: 1;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
color: #909;
opacity: 1;
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
color: #909;
}
</style>
</head>
<body>
<input placeholder="This is a placeholder">
</body>
</html>
0 Comment(s)