type:any

Chrome、IEなどでselectのdisabledの文字色が薄い場合は、opacityを1にする

{ category: "Front-end" }

フォーム周りってブラウザ間で差異があったりして厄介ですよね。ChromeやIEで、disabledになっているselectの文字色のCSSは黒が効いているのに、薄くなっていて、何故なのかと悩んでいたのですが、opacityを1にすることで解決しました。
IE用に::-ms-valueと::-ms-expandもつけましょう。

.セレクタ[disabled="disabled"],
.セレクタ[disabled="disabled"]::-ms-value,
.セレクタ[disabled="disabled"]::-ms-expand {
  color: #333;
  opacity: 1;
}