On Edge Browser, how to change input placeholder text color using CSS?

问题

On Edge Browser, I couldn't able to change input placeholder color.

:-ms-input-placeholder is not working but works fine on IE 10 & IE 11.

input:-ms-input-placeholder {
    font-style:italic;        
    color: red;
    background-color: yellow;
}

is there anyway to make it work using CSS?

回答1:

From CanIUse.com

::-webkit-input-placeholder for (Chrome/Safari/Opera)

:-ms-input-placeholder for IE.

::-ms-input-placeholder for Edge (also supports webkit prefix)

Note the double colon syntax

回答2:

I want to second @ken's comment on @Paulie_D's answer, above.

This works: input[type="text"]::-ms-input-placeholder { color: #000; }

This doesn't: input[type="text"]::placeholder, input[type="text"]::-ms-input-placeholder { color: #000; }

I'm not sure why, but it definitely appears that the -ms-input-placeholder pseudo-element only works if it's separate from other directives.

回答3:

For the current version of the Microsoft Edge browser, placeholder doesn't work correctly. Take a look this issue Microsoft Edge placeholder bug. If placeholder is invisible, try to remove position: relative and :-webkit-input-placeholder opacity.

来源：https://stackoverflow.com/questions/32096102/on-edge-browser-how-to-change-input-placeholder-text-color-using-css