ホームページ >ウェブフロントエンド >CSSチュートリアル >CSS だけを使用して Internet Explorer (すべてのバージョン) のみをスタイル設定するにはどうすればよいですか?

CSS だけを使用して Internet Explorer (すべてのバージョン) のみをスタイル設定するにはどうすればよいですか?

Mary-Kate Olsen
Mary-Kate Olsenオリジナル
2024-12-23 19:07:22793ブラウズ

How Can I Style Only Internet Explorer (All Versions) Using CSS Alone?

CSS を使用した Internet Explorer (すべてのバージョン) のみのスタイル設定

問題:

継承されたプロジェクト内で、 CSS を使用して、HTML を変更せずに特に Internet Explorer をターゲットにしてスタイルを設定する

解決策:

Internet Explorer 9 以前:

  • 条件付きコメントを使用して外部ファイルをロードします。に合わせたスタイルシートIE.
<!--\[if IE]--\>
<link rel="stylesheet" type="text/css" href="all-ie-only.css" />
<!\[endif]--\>

Internet Explorer 10 および 11:

  • 適用する「-ms-high-contrast」を使用するメディア クエリを作成します。 IE 10 専用の CSS スタイル:
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    /* IE10+ CSS styles go here */
}

Microsoft Edge 12:

  • 「@supports」ルールを利用して IE Edge 12 以降をターゲットにします:
@supports (-ms-accelerator:true) {
    /* IE Edge 12+ CSS styles go here */ 
}

のインライン ルールIE8 以下:

/* For IE css hack */
margin-top: 10px /* apply to all ie from 8 and below */
*margin-top:10px;  /* apply to ie 7 and below */
_margin-top:10px; /* apply to ie 6 and below */

注: インライン スタイルシートの場合、IE9 より前のバージョンではメディア クエリと条件付きコメントの使用を検討してください。

以上がCSS だけを使用して Internet Explorer (すべてのバージョン) のみをスタイル設定するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。