Set Input Placeholder color using CSS

To change Input Placeholder Color you need to set the style for Pseudo Elements of CSS. Placeholder style CSS require different Pseudo Elements for different browsers.

See the following example of CSS:

::-webkit-input-placeholder { /* WebKit, Blink, Edge */
    color:    #999999;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
   color:    #999999;
   opacity:  1;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
   color:    #999999;
   opacity:  1;
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
   color:    #999999;
}
::-ms-input-placeholder { /* Microsoft Edge */
   color:    #999999;
}

::placeholder { /* Most modern browsers support this now. */
   color:    #999999;
}

To change Placeholder style  for only defined class eg. "greybox":

.greybox::-webkit-input-placeholder { /* WebKit, Blink, Edge */
    color:    #999999;
}
.greybox:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
   color:    #999999;
   opacity:  1;
}
.greybox::-moz-placeholder { /* Mozilla Firefox 19+ */
   color:    #999999;
   opacity:  1;
}
.greybox:-ms-input-placeholder { /* Internet Explorer 10-11 */
   color:    #999999;
}
.greybox::-ms-input-placeholder { /* Microsoft Edge */
   color:    #999999;
}

.greybox::placeholder { /* Most modern browsers support this now. */
   color:    #999999;
}