CSS でプレースホルダーの色を変えるときは -webkit-input-placeholder などのベンダープレフィックスを使う。結論は次のコードである。
:-moz-placeholder {
color: #aaa;
opacity: 1;
}
::-moz-placeholder {
color: #aaa;
opacity: 1;
}
:-ms-input-placeholder {
color: #aaa;
}
::-ms-input-placeholder {
color: #aaa;
}
::-webkit-input-placeholder {
color: #aaa;
}
::placeholder {
color: #aaa;
}
これをまとめて書くと(少なくとも 2019.07.01 時点のクロームブラウザで)正常に動かない。つまり次のコードではプレースホルダーの色は変わらない。
:-moz-placeholder,
::-moz-placeholder {
color: #aaa;
opacity: 1;
}
:-ms-input-placeholder,
::-ms-input-placeholder,
::-webkit-input-placeholder,
::placeholder {
color: #aaa;
}
ベンダープレフィックスを使うときは別々にしたほうがいいようだ。