CSSハックとは
ブラウザごとにスタイルシートの実装が違うことやバグを利用し、特定のブラウザにのみスタイルを指定する手法のことです。
CSSハックの書式
一言にCSSハックと言っても多数あり、それぞれ書式が違います。
しかし、これだけ覚えておけば大丈夫というものを以下にまとめました。
※対象のブラウザは、Win IE5~7、Mac IE5.2、Firefox、Safari、Operaです
Win IE5~6、MacIE 5.2
1 | * html スタイル名 { |
2 | スタイルプロパティ |
3 | } |
Mac IE5.2
1 | スタイル名 { |
2 | /*\*/ /*/ |
3 | スタイルプロパティ |
4 | /**/ |
5 | } |
Win IE7
1 | *+html スタイル名 { |
2 | スタイルプロパティ |
3 | } |
サンプル
Win IE5~6は背景が青、Win IE7は背景が緑、MacIE 5.2は白、その他のブラウザでは赤
01 | <style type= "text/css" > |
02 | body { |
03 | background: #900; |
04 | } |
05 |
06 | * html body { |
07 | background: #009; |
08 | /*\*/ /*/ |
09 | background: #fff; |
10 | /**/ |
11 | } |
12 |
13 | *+html body { |
14 | background: #0f0; |
15 | } |
16 | </style> |