CSS を使用して IE8 で無効になっている HTML コントロールの色を変更できないのはなぜですか?

CSS を使用して IE8 で無効になっている HTML コントロールの色を変更する

CSS を使用して無効になっている入力コントロールの色を変更しようとしましたが、 IE8では動かないようです。その理由を理解し、デフォルトの動作をオーバーライドする方法を見つけたいと考えています。

使用した CSS:

<code class="css">input[disabled='disabled'] {
  color: #666;
}</code>

ほとんどのブラウザーではうまく機能しますが、IE8 では機能しません。これは、IE8 には、無効な要素に対して特定の動作があり、色のプロパティがデフォルトの灰色で上書きされ、奇妙な白い影が表示されるためです。

この理由は、IE8 で無効な要素は次のようにみなされるためです。コントロールは「非アクティブ」であり、ブラウザーはこれを示すために特定のスタイルをコントロールに適用します。残念ながら、このスタイルにはテキストに強制的な灰色が含まれており、適用しようとしている CSS がオーバーライドされます。

この動作を回避し、IE8 で無効になっているコントロールの色を変更する唯一の方法は、別の方法を使用することです。 。考えられる解決策の 1 つは、disabled 属性の代わりに :disabled 擬似クラスを使用することです。

<code class="css">input:disabled {
  color: #666;
}</code>

この擬似クラスは、disabled 属性が設定されている要素を対象としていますが、実際には disabled 属性は設定されません。自体。その結果、IE8 ではコントロールが「非アクティブ」であるとは見なされなくなり、デフォルトのスタイルをオーバーライドできるようになりました。

以上がCSS を使用して IE8 で無効になっている HTML コントロールの色を変更できないのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。