ホームページ  >  記事  >  ウェブフロントエンド  >  CSS ハックの概要クイック リファレンス マニュアル ブラウザの互換性を知っておく必要がある_エクスペリエンス交換

CSS ハックの概要クイック リファレンス マニュアル ブラウザの互換性を知っておく必要がある_エクスペリエンス交換

WBOY
WBOYオリジナル
2016-05-16 12:05:031542ブラウズ

IE ブラウザをブロックする (つまり、IE に表示されない)

コードをコピー コードは次のとおりです:

*:lang(zh) select {font:12px ! important;} /*FF Visible、特別なステートメント: Opera の最新のアップデートにより、このセンテンスは FF の特別な HACK になりました*/
select:empty {font: 12px ! important;} /*safari で表示*/
ここで選択するのがセレクターで、状況に応じて変更できます。 2 番目の文は、MAC 上の Safari ブラウザに固有のものです。

IE7 でのみ認識されます
コードをコピー コードは次のとおりです。
* html {…}
この HACK は、IE7 専用のスタイルを作成する必要がある場合に使用できます。

IE6 以前の識別
コードをコピー コードは次のとおりです。

* html {…}
ここは特に注意する必要があります。多くの地主が IE6 用の HACK を作成しています。実際、IE5.x もこの HACK を認識できます。他のブラウザでは認識されません。
html/**/ >body select {……}
この文は前の文と同じ効果があります。

IE6 のみが認識しません
コードをコピー コードは次のとおりです。

select { display /*IE6 は認識しません */:none;}
ここでの主な目的は、コロンの前に解放される CSS コメントを通じて属性と値を分離することです。

IE6 と IE5 のみが認識しません
コードをコピー コードは次のとおりです。

select/**/ { display /*IE6、IE5 は */:none を認識しません;}
この文と上記の文の違いは、追加の CSS コメントがあることです。セレクターと中括弧の間。

IE5 のみが認識しません
コードをコピー コードは次のとおりです:

select/*IE5 は認識しません*/ { display:none;}
この文は、前の文から属性領域のコメントを削除したものです。 IE5 のみが認識しません

ボックス モデル ソリューション
コードをコピー コードは次のとおりです。

selct {width:IE5.x width; voice-family :"\"}\""; voice-family:inherit; width:correct width;} ボックスモデルのクリア方法は!重要では扱われません。これは明確にする必要があります。

フロートをクリア
コードをコピー コードは次のとおりです:

select:after {content:"."; display:block; height:0; clear:both; Visibility:hidden;}
Firefox では、子がすべてフローティングの場合、親の高さを変更できません。子全体を完全にラップし、このフローティング HACK を使用して親を一度定義すると、この問題は解決できます。

省略省略記号
コードをコピー コードは次のとおりです:
select { -o-text-overflow:ellipsis; text-overflow:ellipsis;white-space:nowrap; overflow:hidden; }
これは、長さを超えた余分なテキストを自動的に切り取るためのものです。 、省略記号で終わりますが、これは良いテクニックです。 Firefox が現在サポートしていないだけです。

Opera でのみ認識されます
コードをコピー コードは次のとおりです。
@media all and (min-width: 0px){ select {……} }
Operaブラウザは別途設定してください。上記は CSS を書く際のいくつかの HACK です。これらはローカル互換性の問題を解決するために使用されます。互換性コンテンツを分離したい場合は、次のフィルターを試してみるとよいでしょう。これらのフィルターの一部は CSS で作成され、フィルターを通じて特別なスタイルをインポートします。また、一部は HTML で作成され、条件を通じて必要なパッチ スタイルをリンクまたはインポートします。

IE5.x 用のフィルタ。IE5.x のみが表示されます。
コードをコピー コードは次のとおりです。

@media tty {
i{content:"\";/*" "*/}} @import 'ie5win.css'; /*";}
}/* */

IE5/MAC フィルタは通常は必要ありません
コードをコピー コードは次のとおりです。 div>

/*\*//*/
@import "ie5mac.css";
/**/

IE の if 条件ハック
コードをコピー コードは次のとおりです:


すべての IE が認識可能

IE5.0 のみが認識できます

IE6 のみ認識可能
IE6 および IE6 より前の IE5.x のみが認識できます


上記の内容は包括的ではない可能性があることを IE7 のみが認識できます。これらのスキルの要約に参加することを歓迎します。同時に、これらの HACK を開発した作者に感謝したいと思います。
声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。