クロスブラウザのCSSルール：Mozila、chrome、safariとcss2 vs css3

Question

私は今まで無視した2つの問題がありますが、私は本当にそれらに光を当てていただきたいと思います。

最初に： Safari、Chrome、Firefoxの違いや、エンジンのレンダリング方法が異なるさまざまなタグはどうやって解決できますか？私はちょうど同じCSSルール内のそれぞれのための右の属性を書き留める必要がありますか？良い方法はありますか？

私はIEのためにこれらのブラウザ用のCSSシートを分ける方法はありますか？これはお勧めですか？

2番目： CSS3の属性はどうですか？私はCSS2属性の後に同じ規則でそれらをもう一度書くべきでしょうか？

CSSをWC3で検証する際に問題が発生しますか？

Answer 1

ようこそ:)

あなたは接頭辞なしで起動する場合は、まず、すべての意味論的に適切なタグで、一般的に、コードを書く必要があります。

次に、あなたの目標を決めることができます。

W3C準拠のCSSファイルが必要な場合は、デフォルトでベンダー固有のプレフィックスを取り除く必要があります。これにより、最新のブラウザが標準化されたCSSプロパティをサポートしていれば、そのCSSプロパティを取得できます。

これはあなたが望むよりも少ない市場を対象とするため、漸進的強化が可能かどうかを尋ねるべきです。 jQuery、MooTools、Prototypeライブラリなどのスタイルを適用するなど、ページがロードされた後にCSSを適用してビジュアルを合理的に拡張できる場合は、これらのライブラリはすでにWebサイトで目的を果たしています。また、Modernizrと組み合わせて使用​​して、さらにサポートしたい要素を判断することもできます。

しかし、ブラウザは理解できないプロパティをスキップしてそのプロパティをレンダリングする可能性が高いため、最初にW3C Standardsにコードを書いてから、最後の（正しい）プレフィックスを追加する前に、追加のベンダープレフィックスを追加すると、コンプライアンスと設計のニーズを満たす合理的な措置を講じることになります。

編集： からの検証結果との間に混乱の少しがあります：

http://validator.w3.org/

とCSSエフェクトクロスブラウザを取得するために、ベンダープレフィックスに関連する有効なコードの書き込み：

List of CSS vendor prefixes?

を

いくつかのクロスブラウザCSSで作業する場合は、http://csspie.com、いくつかのCSS3プロパティとのIE互換性、便利なクロスブラウザグラデーションのhttp://www.colorzilla.com/gradient-editor/さまざまなプロパティのIEサポートのさまざまなバージョンを含む代替ベンダーのプレフィックスを提供するコードの場合はhttp://cssplease.comです。

検証の面では

、ここではW3Cがそれについて言っているのです：（はここのコメントを参照してください。W3 VALID cross browser css gradient,）：あなたは、コード最初の仕様に応じて出て​​、あなたのコードをテストする場合http://www.w3.org/TR/css3-syntax/#vendor-specific

、ここで公式ドキュメントをそれに対して、ベンダーのプレフィックスを追加して、サポートしたいブラウザーに同じ効果を得ることができます（プログレッシブ・エンハンスメント：What is Progressive Enhancement?参照）。コードが適切な標準をサポートしていると確信できます。追加の機能を持たないユーザーにも役立ちます（WAI III準拠、508 coより包括的なサイトを作成したい場合は、他のものもあります）。

警告：ウェブアプリケーションは、視聴者の誰かに応じて、必ずしも包括的であるとは限りません。

Answer 2

サイトでjqueryを使用している場合は、PrefixFreeを調べるとよいでしょう。ベンダーの接頭辞を追加するスクリプトです。たとえば、border-radius:6px;をyor cssに入れて、ブラウザーを読み取り、適切なベンダー接頭辞をjs経由で追加します。私はそれが私のcssのドキュメントをより読みやすく保つために好きです。