CSSハックまとめ（IE）
Posted under: 
スタイルシートを使ってページを作成していると
必ずと言って良い程、ぶつかるブラウザ間の見え方の違い ＾＾；
IEだと、きちんと表示しているのに、Firefoxだと表示が違ったり、その逆だったり、
同じIEなのに見え方が違う場合の、いわば最終手段といった感じが、いわゆるハックですかね・・
今回はそんな最終手段として IE用（IE6～IE8）のハックをまとめてみました。
IE6に適用
1 2 3 4 | .samle { background: #000; background: #999; /* 通常のブラウザ */ _background: #000; /* IE6のみ適用 */ } |
適用するプロパティの前にアンダースコアバー（ _ ）をつける。
1 2 3 | *html body .samle { background: #000; } |
適用するセレクタの前に *html body をつける。
IE6 IE7に適用
1 2 3 4 | .samle { background: #999; /* 通常のブラウザ */ *background: #000; /* IE6 IE7のみ適用 */ } |
適用するプロパティの前にアスタリスク（ * ）をつける。
IE7に適用
1 2 3 | *:first-child + html .samle { background: #000; } |
適用するセレクタの前に *:first-child + html をつける。
IE8に適用
ひとつのプロパティだけ適用の場合
1 | html>/**/body p { color /*\**/: blue\9 } |
複数のプロパティを適用する場合
1 2 3 4 | html>/**/body p { color /*\**/: blue\9; font-size: 20px\9; } |
１．html>/**/bodyと、子セレクタを使いつつ、
>とbodyの間に/**/と、空のコメントを入れます。
２．プロパティの後ろに/*\**/を入れます。
３．値の後ろに\9を追加します。
他のプロパティも指定したい場合は、\9がないときと同じように行末に;をつけて、
次のプロパティからは/*\**/なくても大丈夫なようです。
※ブラウザやパソコンの環境によっては、半角の￥のところが
逆スラッシュに見えますので要注意。
逆スラッシュになっているところは半角の円マークです。
以上、IEハックまとめでした。
こちらも合わせてご覧ください - このページの内容と関連がある記事 -
TrackBack URL for this entry
コメントをいただけると励みになります！よろしくお願いします。
Blog info
Recommend Servers
