【CSS】お手軽IE対応CSSハック

Tweet

Category css 2010/11/04

問題

IE6、IE7対応はしたい。　スタイルシートが汚くなるのはいやだ。

解答例

１、HTMLの条件分岐を使って、そもそものファイルを分けてしまう。

このIE用のファイルの中なら何でもアリ。

<!--[if IE]><link rel="stylesheet" type="text/css" href="css/ie.css"><![endif]-->

２、頭に _ アンダースコア

IE6は頭に_がついていても反映してしまう

p {
    color:#cc0000;
    _color:#0000cc;
}

３、頭に * アスタリスク

IE6、IE7は頭に*がついていても反映してしまう

p {
    color:#cc0000;
    *color:#0000cc;
}

IE7だけに適用したいときは、IE6だけに効くアンダースコアで上書き。

p {
    color:#cc0000;
    *color:#0000cc;
    _color:#00cc00;
}

４、最後に \9 バックスラッシュ9（未検証）

IE6、IE7、IE8用には \9。

p {
    color:#cc0000;
    color:#0000cc\9;
}