CSS Hackまとめ

3127 ワード

ここでselectはセレクタであり、場合によっては交換される.2番目の文はMAC上のsafariブラウザ独自のものです.
このHACKは、IE 7識別*:lang(zh) select {font:12px !important;} /*FF,OP */
select:empty {font:12px !important;} /*safari */
のみが、必要に応じてIE 7のみをスタイル化する場合に使用することができる.
IE 6およびIE 6以下識別*+html {…}この場所は特に注意しなければならない多くの地主がIE 6であるHACK実はIE 5と書いていることに注意しなければならない.xは同様にこのHACKを認識することができる.他のブラウザでは認識されません.* html {…}この文は前の文と同じ役割を果たしています.
ここでは主にCSS注釈によって1つの属性と値が分離され、ストリームはコロンの前に放出される.
IE 6とIE 5のみがhtml/**/ >body select {……}を認識しないここでは、前述の文とは異なり、セレクタとカッコの間にCSS注釈が1つ追加されている.
IE 5のみがselect { display /*IE6 */:none;}を認識しないという文は,前の文で属性領域を除いた注釈である.IE 5のみ認識しない
ボックスモデル解決方法select/**/ { display /*IE6,IE5 */:none;}ボックスモデルのクリア方法は通過しません!importantが処理します.この点は明確にしなければならない.
クリアフローティングselect/*IE5 */ { display:none;} Firefoxでは、子がフローティングである場合、親の高さが子全体を完全に包むことができないため、このクリアフローティングHACKで親を一度定義すれば、この問題を解決することができる.
略号selct {width:IE5.x ; voice-family :""}""; voice-family:inherit; width: ;}これは長さを越えた後に自分で多くの部分の文字を切り取って、略号で終わる、良い技術です.ただ現在Firefoxではサポートされていません.
Opera識別select:after {content:"."; display:block; height:0; clear:both; visibility:hidden;}のみがOperaブラウザに対して個別の設定を行う.
以上はCSSのいくつかのHACKを書いて、正しいラベルネスト(div ulliネスト構造関係)に従うことを提案して、このようにHackを使う頻度を減らすことができて、理解の誤りに入らないでください、1ページで多くのhackを必要としてマルチブラウザの互換性を維持するのではありません)、多くの場合、1つのHackもブラウザを非常によく働かせることができなくても、これらはすべて局所的な互換性の問題を解決するために使用して、互換性の内容も分離したいならば、下のいくつかのフィルターを試してみてください.これらのフィルタはCSSに書かれているものもあれば、フィルタによって特別なスタイルがインポートされているものもあれば、HTMLに書かれている条件によってリンクされているものもあれば、必要なパッチスタイルがインポートされているものもあります.
IE5.xのフィルタは、IE 5のみである.x select { -o-text-overflow:ellipsis; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; }IE 5/MACのフィルタは、一般的に@media all and (min-width: 0px){ select {……} }を使用しない
以下はIEの条件コメントですが、個人的には条件コメントで対応するHackを呼び出すのが完璧なマルチブラウザ互換性のある解決策だと思います.hackが必要な場所を1つのファイルに単独で入れて、ブラウザのバージョンが合っているときにそのHackされたスタイルを呼び出すことができて、このように使うのがとても便利であるだけではなくて、そのCSS自体を作ることにとって、もっと厳格にhackを使う必要があるかどうかを観察することができて、多くの場合、私がCSSを書いてもしすべてのコードをHackを含めて1つのCSSファイルに書くならば時とても勝手です.どのようにHackを考えてどのようにHackして、あなたが独立して書く時、あなたは思わずHackが必要かどうかを考えて、先にHack CSSですか?それともメインCSSの中身をできるだけHackが要らないように調整しますか?少ないHackだけで多くのブラウザを利口にして言うことを聞くと、達成感があるのではないでしょうか.どうやって選んだか知ってるでしょ~ふふ
IEのif条件Hack自身は、このIE条件コメント @media tty {
i{content:"";/*" "*/}} @import 'ie5win.css'; /*";}
}/* */
を参照するすべてのIEを柔軟に使用することができ、/**//*/
@import "ie5mac.css";
/**/
IE 5を識別することができる.0パッケージIE 5.5いずれも識別可能Only IE IE 7のみ識別可能
IE5.0
Only IE 5.0+
IE6
Only IE 7/-
IE6 IE6 IE5.x
Only IE 7/-

Hack 。