WebWedge.jpg

phpとかJSとか適当に書いています。

Google Chrome のCSSハックテスト

なんか意外と需要があるみたいなので。

で、8種類ほどのCSSハックを試してみたのですが試した中で見る限りは、Safariと全く同じ適用状況でした。
下記の各ボックスで、背景画像が適用されているものはCSSが通っている、背景が黒のままのものはCSSが通っていません。

* html body #box1 { STYLE }
*+html body #box2 { STYLE }
html>body #box3 { STYLE }
html>/**/body #box4 { STYLE }
#box5 { _STYLE }
#box6 { /*\*/STYLE /* */ }
html:first-child #box7 { STYLE }
html:not(:only-child:only-child) #box8 { STYLE }

まあ、今後色々修正が入るでしょうし、GCの為にCSSハックを使用するのは避けた方が良いのでしょうね。

どうしても、な場合は

  1. 全ブラウザに読み込ませるCSSを作る。
  2. その後に、CSSファイルの2行目以降に@charset “文字コード”;を記述したCSSファイルでCSS定義を上書きし、GC以外に適用させる。

というのはどうでしょうか・・・。
激しくオススメしませんけど。

おそらく、ですがCSSに関してはSafariと同じ解釈と思ってて当分はOKじゃないかと思います。

Categories

CSSハック, Google Chrome, コーディングとか

COMMENTS

“Google Chrome のCSSハックテスト” への1件のコメント

  1. zerodtkjoe より:

    Thanks for the info

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です