8

現在の W3C 標準から逸脱した CSS プロパティのブラウザー固有の実装のリストがあるリソースを見つけようとしています。

たとえば、IE が次のようなものをサポートしているとします。

.my-class {
  -ms-foo: fizz buzz;
}

しかし、提案が推奨候補になったとき、標準化された同等のものは次のとおりでした。

.my-class {
  foo: buzz fizz;
}

CR の前にリリースされた IE のバージョンをサポートするために、次のように記述します。

.my-class {
  -ms-foo: fizz buzz;
  foo: buzz fizz;
}

この種の変更のリストをグーグルで検索しても、あまり実りがありません。ベンダーの接頭辞については多くの嘆きと歯ぎしりがありますが、多くの「落とし穴」リストはありません。私がこれまでに発見した中で最も良いのは、変更点 (その場合は) についての無造作な言及-webkit-border-radiusですが、それらが実際に期待される入力を文書化することはめったにありません。彼らは単に壊れた例を与える傾向があります。

存在するプレフィックスの OKリストを(標準ステータスと共に) 見つけましたが、残念ながら、関心のある変更を特定するために必要な種類の詳細は示されていません。

それで、そのようなリストは存在しますか?

部分的なリスト、または非常に古いブラウザーを除外したリストを取り上げます (たとえば、IE6 はあまり気にしません)。また、大きな 3.1 ブラウザー (IE、Firefox、Webkit/Chrome/Safari、およびOpera )についてのみ本当に心配しています。

私は、W3C によって対処されていないこと (外観など) にも関心があります。これは、ベンダーが直接作り上げたものを気にしなくても、十分に難しい問題です。

4

3 に答える 3

2

そこに網羅的なリストはないようですが、CompassCSSPrefixer、およびPeter Beverlooからのこのリストに基づいて、私が一緒にこすり取ることができるものをここに示します。

背景クリップ

-moz-background-clip-mozバージョンの代わりにを受け入れpadding、同じように動作しますが、代わりにを受け入れますborderpadding-boxborder-box -webkit-background-clipcontentcontent-box

背景-起源

-mozおよびバージョンは、同等-webkitの値と同じ値を受け入れますbackground-clip

背景サイズ

-webkit-background-size単一の値を複製するため、-webkit-background-size: 10pxと同等background-size: 10px 10pxです。に相当する接頭辞付きのWebkitbackground-size:10pxはです-webkit-background-size: 10px auto;

ボーダー半径と友達

、、などに-moz相当するものはborder-top-left-radiusborder-bottom-left-radiusなどです。-moz-border-radius-topleft-moz-border-radius-bottomleft

-webkit-border-radius2つの値の省略形の処理において、最終仕様とは異なります。Webkitは、すべての長い形式のバージョンに2つの値が渡されたかのように扱います。

より具体的には:

-webkit-border-radius: 1px 2pxと同等です

-webkit-border-top-left-radius: 1px 2px;
-webkit-border-top-right-radius: 1px 2px;
-webkit-border-bottom-left-radius: 1px 2px;
-webkit-border-bottom-right-radius: 1px 2px;

whileborder-radius: 1px 2pxはと同等です

border-top-left-radius: 1px;
border-top-right-radius: 2px;
border-bottom-right-radius: 1px;
border-bottom-left-radius: 2px;

これについて私が知っている唯一の回避策は、の2つの値のケースを、-webkit-border-radius適切なに一致するように長い形式に拡張することborder-radiusです。

画面

どこでも作業したい場合はdiplay:box、次のようなプレフィックス値を使用する必要があります。

display:-webkit-box;
display:-moz-box;
display:box;

すべてのボックスモデル固有のプロパティ(box-alignなど)にもこれらのブラウザのプレフィックス付きバージョンがあるため、これがなぜであるかはわかりません。


複数のブラウザがサポートしている場合でも、外観など、現在W3Cドキュメントの一部ではないものは含まれないことに注意してください。

于 2012-07-01T20:40:06.280 に答える
2

CSS3Info は便利だと思います: http://www.css3.info/preview/ (編集済み- 申し訳ありませんが、これは私が最初に投稿するつもりだったものです)。

編集:うーん。今日は打率ゼロです。そのサイトにはブラウザの接頭辞がもっとあると断言できました...

于 2012-06-24T23:15:18.680 に答える
1

標準からの逸脱は珍しくありません (つまり、癖のレンダリング) が、標準/提案された表記法からの逸脱はかなりまれです。このリソースはそのトリックを行うはずです:

caniuse.com は通常、リソース セクションに優れた外部リンク提供ます-webkit

于 2012-06-24T23:38:23.900 に答える