Internet Explorer 8(IE8)の場合、次のCSSを使用したいと思います。
color : green;
IE9、IE6、7ではなく、IE8にのみ影響するハックを適用したいと思います。
Internet Explorer 8(IE8)の場合、次のCSSを使用したいと思います。
color : green;
IE9、IE6、7ではなく、IE8にのみ影響するハックを適用したいと思います。
次のように、HTMLで条件付きコメントを使用します。
<!--[if IE 8]>
<style>...</style>
<![endif]-->
ここを参照してください:http ://www.quirksmode.org/css/condcom.html
IEのバージョンを確実にテストでき、他のブラウザーが混乱しないことも確認できます。
メディアクエリを使用して、各ブラウザを分離します。
/* IE6/7 uses media, */
@media, {
.dude { color: green; }
.gal { color: red; }
}
/* IE8 uses \0 */
@media all\0 {
.dude { color: brown; }
.gal { color: orange; }
}
/* IE9 uses \9 */
@media all and (monochrome:0) {
.dude { color: yellow\9; }
.gal { color: blue\9; }
}
/* IE10 and IE11 both use -ms-high-contrast */
@media all and (-ms-high-contrast:none)
{
.foo { color: green } /* IE10 */
*::-ms-backdrop, .foo { color: red } /* IE11 */
}
参考文献
を使用し\0
ます。
color: green\0;
ただし、IE9も除外したいので、条件付きコメントをお勧めします。このハックがIE9にも影響するかどうかはまだ予測できません。
とにかく、IE8固有のハックは必要ありませんでした。それは何ですか、あなたが解決したいIE8特有の問題ですか?とにかくIE8標準モードでレンダリングしていますか?そのレンダラーはかなり良いです。
CSSの小さな変更が必要な場合は、IE8以下(IE6、IE7、IE8)を対象とする\9を使用します。
.element {
color:green \9;
}
最良の方法は、次のようにHTMLで条件付きコメントを使用することです。
<!--[if IE 8]>
<style>...</style>
<![endif]-->
このようなことをすることはあなたのために働くはずです。
<!--[if IE 8]>
<div id="IE8">
<![endif]-->
*Your content*
<!--[if IE 8]>
</div>
<![endif]-->
次に、CSSは次のようになります。
#IE8 div.something
{
color: purple;
}
そのため、最近の質問で、IE8のみを除外するためのセレクターセットのハッキングに気付くようになりました。
.selector, #excludeIE8::before {}
IE 8はセレクターセット全体を破棄しますが、5-7と9-11はそれを問題なく読み取ります。::
セレクター(::first-line, ::before, ::first-letter, ::selection
)はどれでも機能し::before
ます。行が正確に読み取れるように選択しただけです。::before
偽のセレクターの目的は偽物であることに注意してください。実際にIDを持つ要素がある場合は、必ず別のセレクターに変更してください。excludeIE8
興味深いことに、最近のブラウザー(FF 45-52、GC 49-57、Edge 25/13)では、悪い::
セレクターがセレクターセット全体を食いつぶします(dabblet demo)。Safariの最後のWindowsバージョン(およびLTE IE 7、笑)は、理解している間はこの動作をしないよう::before
です。さらに、これが意図された動作であることを示すものが仕様に見つかりません。これは、以下を含むセレクターセットで破損を引き起こす可能性があるため::future-legitimate-pseudoelement
です。...これはバグであり、将来的に私たちの後ろをかじる。
ただし、(ルールレベルではなく)プロパティレベルでのみ何かが必要な場合は、上記のZigaが追加による最善の解決策でした \9
(スペースが重要です。nbspを使用するため、そのインラインをコピーアンドペーストしないでください)。
/*property-level hacks:*/
/*Standards, Edge*/
prop:val;
/*lte ie 11*/
prop:val\9;
/*lte ie 8*/
prop:val \9;
/*lte ie 7*/
*prop:val;
/*lte ie 6*/
_prop:val;
/*other direction...*/
/*gte ie 8, NOT Edge*/
prop:val\0;
ちなみに、私は汚いネクロマンサーのように感じますが、今日見つけた除外IE8のみのセレクターセットハックをどこかに文書化したかったので、これが最も適した場所のようでした。
すでに示したハックを使用してから、IE7以下のハックを使用してオーバーライドすることはできませんか?
クラスをHTML要素に取り込むには、競合しているIEバージョンを特定するさまざまな方法があります。Modernizr、HTML 5ボイラープレートなど、または単に独自のバージョンを作成する方法です。次に、そのクラス(.lt-ie9など)を通常のCSSセレクターで使用できます。ハックは必要ありません。以前のバージョンではなくIE8にのみ影響を与える場合は、.lt-ie8セレクターを使用して古い値を元に戻します。
IE8ネイティブブラウザのみの場合:
.classname{
*color: green; /* This is for IE8 Native browser alone */
}
私はIE10以下のCSSスタイリングに適したオプションを探していました(ただし、IE8でも機能します)。このアイデアを思いつきました。
<!--[if lt IE 10]><div class="column IE10-fix"><![endif]-->
<!--[if !lt IE 10]><!--><div class="column"><!--<![endif]-->
私は自分のdivまたはあなたが望むものを追加のクラスで宣言します。これにより、同じスタイルシートに非常に読みやすい方法で追加のCSSを含めることができます。
これはW3Cで有効であり、奇妙なCSSハックではありません。
これはBellowIE8バージョンで機能します
.lt-ie9 #yourID {
あなたのCSSコード
}