17

移行用の CSS ベンダー プレフィックスについて質問があります。

このソースは、「すべてのブラウザーでこれを機能させるには、通常のプレフィックスをすべて使用する必要がある (-o-、-webkit-、-moz-、-ms-)」と述べています。

そのページ-webkit-には、プレフィックスとプレフィックスのみが表示され、-moz-IE 10+、FF 16+、および Opera 12.1+ がプレフィックスのないバージョンを読み取ることができると主張しています。

-webkit-Twitter Bootstrap のコードには、接頭辞なしのバージョンに加えて、-moz-および-o-接頭辞付きのバージョンが常に存在します。

どのプレフィックスを使用すればよいですか?

4

6 に答える 6

30

http://caniuse.com/#search=transitionによると、最新のブラウザーには -webkit- とプレーン プロパティが必要です。

-webkit-transition: all .5s ease;
transition: all .5s ease;

ただし、それらすべてを追加しても問題ありません。ただし、プレフィックスのないプロパティが最後のプロパティであることを確認してください。

編集:以下のコメントで述べたように、[すべてのバージョン] をクリックすると、各ブラウザーがいつプレフィックスを削除したかを確認できます。今のところ、-moz- と -o- も使用することをお勧めします。

2015 年 5 月の編集: Autoprefixer をビルド プロセス ( Gulp /Grunt タスクなど) のステップとして、またはコード エディターのプラグインとして使用することを強くお勧めします。これは、caniuse.com ブラウザー サポート統計に自動プレフィックスを提供します。

編集 2019:プレフィックスは不要で、Autoprefixer の必要性はますます少なくなっています。将来は素晴らしいです:)

于 2013-01-15T00:13:11.843 に答える
19

編集:プレフィックスはもう必要ありません。

を使用するだけtransitionです。

現在のところ、CSS3 トランジションにはすべてのベンダー プレフィックスを使用する必要があります。例えば、

-webkit-transition: all 500ms;
   -moz-transition: all 500ms;
     -o-transition: all 500ms;
        transition: all 500ms;
于 2013-01-15T00:09:31.843 に答える
1

使用する CSS プロパティによって異なります。Mozilla は、多くのプロパティの接頭辞をなくすことに成功しています。ただし、すべてのプロパティにプレフィックスがないことはわかりません。Chrome チームから、グラデーションを接頭辞なしにしたいというニュースを聞きました。Opera についてはわかりませんが、Internet Explorer 10 では-ms多くの CSS3 プロパティにプレフィックスが必要です。

今日は、接頭辞を追加するだけでよいと思います。でも未来はこうじゃない！

于 2013-01-15T00:12:59.710 に答える
0

もちろん、接頭辞なしのバージョンと一緒に-webkit-のみ。

他のすべてのブラウザは、プレフィックスのないプロパティ（FirefoxやOperaなど）で移動したか、使用したことがない（IEなど）

CanIUse.comで最新情報を定期的に確認することをお勧めします。

http://caniuse.com/#feat=css-transitions

于 2013-01-15T00:14:37.317 に答える
0

Prefix Freeをダウンロードしてください。これは非常に小さな JavaScript であり、プレフィックスを必要としないほぼすべてのプロパティをプレフィックスなしで使用できます (遷移、アニメーション、メディア クエリを含む)。

編集: このすべての唯一の例外は、Opera のメディア クエリです。ここでは、ピクセル比率 (およびそれ以外のもの) を 10 進数ではなく分数で表す必要があります。

于 2013-01-15T00:10:20.943 に答える
0

ここでは逆に、別のアプローチを提案します。分析機能を備えた Web サイトをセットアップしている場合は、ブラウザーの統計情報とバージョンを確認し、ユーザーが実際に使用しているものを確認してください。

もちろん、プレフィックスの大部分を削除することはできますが、ユーザーが (何らかの理由で) 古いブラウザーを使用している場合、それらの機能は利用できません。

必要なプレフィックスを正確に教えてくれる任意の Web サイトはありません。自分のデータからその情報を把握できるのは、あなただけです。

データがない場合は、すべてのプレフィックスを追加して、できるだけ多くの人をサポートしてください。その後、数か月後にデータをチェックし、必要に応じてリファクタリングします。

于 2013-01-15T00:19:03.413 に答える