Change an input or textarea’s HTML5 placeholder color with CSS

Have you ever tried to change the input or textarea placeholder color in your page using CSS?

From IE 10+ and with most of the browsers you can do this, using separated rules for each browser (not compatible with Opera):

::-webkit-input-placeholder { /* WebKit browsers */
    color:    #ddd;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    color:    #ddd;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
    color:    #ddd;
}
:-ms-input-placeholder { /* Internet Explorer 10+ */
    color:    #ddd;
}

If you have a compatible browser, you see below an input field of type “search” with the text in red:

Written by

Me gusta la tecnología, sea de que tipo sea y a nivel informático tengo bases de programación, pero lo que más me gusta realmente es la parte de frontend, con que trabajo hace ya más de 6 años. Pero ni siempre me gusta estar encerrado, sobretodo en verano, que salgo con la bicicleta, la moto, voy a bucear, a la playa, etc. Intento viajar siempre que puedo, sea en inverno o en verano.Me gusta la tecnología, sea de que tipo sea y a nível informático tengo bases de programación, pero lo que más me gusta realmente es la parte de frontend, con que trabajo hace ya más de 6 años. Pero ni siempre me gusta estar encerrado, sobretodo en verano, que salgo con la bicicleta, la moto, voy a bucear, a la playa, etc. Intento viajar siempre que puedo, sea en inverno o en verano.

No Comments Yet.

Leave a Comment