プログラムの開発

CSS互換性の問題CSS Hackが役立ちます

CSSやdivは知っていましたが、ブラウザの互換性については全く知りませんでした。今回は、友人の紹介などを経て、css []

記事の目次

CSSやdivは知っていましたが、ブラウザの互換性については全く知りませんでした。このショッピングモールは、友人の紹介などの後、そしてこの魔法のもののCSSハック。試してみると、本当にうまくいきました。多くの人がブラウザの互換性の問題に悩まされ、CSSハックを使用してすべてが解決されました。CSSハックを共有する。
CSS Hackは、標準CSSが各ブラウザ表示効果を互換することができない場合に使用する救済方法であり、各ブラウザメーカーがCSSを解析して合意する前に、我々はこのような方法でこのような任務を完了することができます。

我进行前端开発的时候,试験用的ブラウザ大体有IE7 IE6 Opera 9文章作成时版为9.25 8825 Safari3文章作成时版为3.0.4 523.15 Firefox2文章作成时版为2.0.0.11

正常なselector { property value; }の上で、よく具体的な状況に応じて同じ要素にHackを使用してブラウザ間の統一を達成する。

IEファミリCLARiX

selector { +property value; }は属性名の前にプラス記号“+”を付けると,このHackはIEシリーズのみが認識できる.
selector { *property value; }は属性名の前にアスタリスク"*"を付けるが,このHackはIEシリーズでしか認識できない.
selector { _value; }は属性名の前に“_”を付け、このハックはIEシリーズ(7を除く)のみされる。
* html selector{value; }セレクタに継承法 * html selectorをし,このハックはIEシリーズ7を除くのみできる.
HTMLでは/** / >body selector {value; }セレクタに継承法 htmlを/** / >body selectorこのHackはIEシリーズのみ7を除くできる。
selector { property}/** /value; }属性名とコロン""の间にコメントを入れ、6用をマスクする。
セレクターの選択/**(プロパティ)/** /value; }セレクタと中括弧"{"の間およびプロパティ名とコロン""の間にコメントを入れ、IE5とIE 6をマスクしますIE 5.5をマスクしません。
選択する。/** / { property value; }セレクタと中括弧"{"の間にコメントを入れてIE5用をマスクする.
*+html selector { property value ! important; }セレクタに継承を適用する *+html selectorさらに! importantこのHackは7のみでできます。

Firefox:

* lang lang selector { property value ! important; }疑似クラスlang language +! important的话,Firefox。

Safari:

selector ty {value ! important; }疑似クラスtyに加えて! important的,Safari.

Operaの

@media all and min-width 0px { selector { property value; } }特殊継承法を用いて定義すると、現時点ではOperaのみが認識できる。

以上的Hack并不完全,大家一起补充.

对Hack的运用,最も一般的なのはCSSボックスモデルHack,クリーンアップフローティングHack.

CSSボックスモデルはIE 5. Xで深刻な解析エラーがあります。IE 5. X用のハック。

selctor { width IE5. X幅; voice-family ''}'; voice-family inherit; width正しい幅; }

クリアフローティングHackは、この用を信じる人が多い

selector after { content '.'; display block; height height 0; clear clear both; visibility visibility hidden

他还有很多多多CSS Hack的运用,一一列挙的话能成一册本了想到再添加吧。