[ CSS ] CSS ハック ( Hack ) のまとめ

CSS ハックと言うものを使うと、特定のブラウザだけにスタイルを適用したり、バグを回避したりできるみたいなので、その方法をメモ。

Netscape 4.x では外部 CSS ファイルを読み込まないようにする CSS ハックの書き方

Netscape 4.x に CSS を読み込ませない様にするには、スタイルシートをリンクする時、link タグの media 属性に screen 以外の別の属性を加えると良いんだそうな。

<link rel="stylesheet" type="text/css" href="test.css" media="screen,tv">

参考 : Netscape 4.x 系に CSS を読み込ませない覚え書き

Mac Internet Explorer 5.x に CSS を適用しないようにする CSS ハックの書き方

下の様にスタイルを記述すると、コメントで囲んだ部分のスタイルを Mac IE で適用しない様に出来るみたい。この手法を Holly hack と言うんだそうな。

Mac IE 5.x 用のスタイルを指定
/* ここから Mac IE 5.x に適用したくないスタイル \*/
他のブラウザ用のスタイルを指定
/* ここまで Mac IE 5.x に適用したくないスタイル */

さらに、下の様に書くと、Mac Internet Explorer 5.x に CSS をインポートしない様にできる。

/*  \*/
@import url("common.css");
/*  */

Windows Internet Explorer 5.x 用にスタイルを上書きする CSS ハックの書き方

Windows IE 5.x は、ボックスモデルの解釈が違うので、モダンブラウザ用の common.css をインポートしてから、Windows IE 5.x 用にスタイルを上書きしてバグ対策する。

@import "common.css";
/* Windows IE 5.x 用に上書きするスタイルを読み込む */
@media tty {i{content:"\";/*" "*/}} @import 'wie5x.css'; /*";}}/* */

コメントを残す

メールアドレスが公開されることはありません。