問題タブ [vendor-prefix]

IEはバージョン10で条件付きコメントを削除しているので、IE10をターゲットにした「CSSハック」を見つける必要があります。CSSプロパティではなく、「ハッキング」されるセレクターである必要があることに注意してください。

Mozillaでは、次を使用できます。

Webkitを使用している間は、通常、次のことを行います。

IE10で同様のことをするにはどうすればよいですか？

-moz- や -webkit- などの他のブラウザー固有のコード名が使用されていることは理解しています。前者は mozilla 用で、後者は chrome と safari 用ですが、-mso- とは正確には何ですか? Microsoft Office の略ですが、そのプログラムで Web ページが表示されることはありませんね。

当たり前の答えかもしれませんが、

いったいなぜ、ブラウザーは独自のベンダー プレフィックスborder-radiusなどを作成することを決定するのでしょうか?

つまり: なぜ入力しなければならないのですか:

各プラットフォームが「私たちはクールだ、角を丸くするためのより良い方法を考え出すだろう」と考えたからでしょうか? 1 行に対して 3 行を入力するのは、まったくもって不可解にも冗長に思えます。

重複の可能性：
ブラウザがCSSプロパティのベンダープレフィックスを作成するのはなぜですか？

たとえば、回転させたい画像がある場合、Google Chromeを使用しても何も起こらないのに、使用transform: rotate(50deg);すると正常に動作するのはなぜ-webkit-transform: rotate(50deg);ですか。

プログラマー/デザイナーがブラウザーごとに1回ではなく、同じコードを1回だけ書き込むようにするための標準を用意することの全体的なポイントではないでしょうか？これは、近い将来に変更される予定ですか、それとも常にこのようになりますか？私はCSS3を使い始めたばかりで、これは私には本当に奇妙に思えます。

新しいベンダー固有のプロパティが使用されているのをよく見かけますが、この質問のきっかけは-moz-appearance:button;どこかで見られていました（要素をボタンのように見せます）。

これらすべての拡張機能（ベンダープレフィックスルール）のリストはどこにありますか？

Mozillaには1つ、Operaには1つ、Webkit用の「非公式」のものがあります（プロパティについては説明していません）。IEには運がなかった。すべてが1か所にない場合は、IEとWebkitの公式の包括的なリストで十分です。

……とてつもなく痛い。

これを行うためのライブラリ/フレームワーク/より良い方法はありますか? できればJSの1行だけで？

私は今、これにしばらく興味を持っていました。

css3 プロパティはまだ標準化されていませんが、特定のブラウザーのプレフィックスを使用して、ブラウザーで実装できます。たとえば、border-radius を使用することができ、最新のブラウザーで問題なく動作します。ただし、ブラウザー ベンダーの以前のバージョンでは、-moz、-webkit などのベンダー固有のプロパティを使用して動作させることができます。

さて、私のページでは、グラデーションとボーダー半径を使用し、それらを使用するいくつかのクラスを作成し、これらのクラスを適用しました。

次のうちどれを行うのが良いですか？

1. JavaScript を使用してサポートがあるかどうかを確認し、サポートされている場合はプロパティを使用します。上記が false の場合は、ユーザー エージェントを確認し、それに応じてベンダー固有のプロパティを適用します。

2. クラス内のすべてのブラウザ接頭辞を使用して、ブラウザに適したものを使用させます。

私が興味を持って懸念しているのは、DOM ロードのパフォーマンスと時間です。

私はいくつかのCSS3のものをテストborder-radiusしていましたが、（少なくとも最近の最新のブラウザーでは）ベンダープレフィックスをもう必要としないようないくつかのプロパティを発見しました。

私の次のウェブサイトはIE9/Chrome 15 + / FF8 +のような最近のブラウザのみを対象としているので、私は疑問に思っていました：

ベンダープレフィックスを安全に削除できる現在のCSS3プロパティのリストはありますか？

注：プレフィックス付きのプロパティを自動的に挿入するJSハックには興味がありません。

下位互換性についてあまり気にしていないことを考えると (グラフィックスなどに依存するのではなく、CSS3 および HTML5 ベースのデザインを検討しています)、次のような CSS を使用する利点は何ですか。

使用するだけでは：

後者は、ほとんどの最新のブラウザーで正常に動作するようです (明らかなことを除いて! :p IE を見てください! IE9 ではおそらく動作すると思いますが、現時点では Mac を使用しているためテストできません)。 .

私は物事を見ていますか？上記のブラウザ固有のコードを使用する必要がありますか? それとも、すべてのブラウザが標準をサポートする方向に進んでいますか?

要素のスタイル属性を設定する JavaScript の行を書いていた場合、次のようになります (この例: "幅"):

CSS 要素にダッシュがある場合は、次のようになります (この例: "margin-top"):

-webkit-しかし、次の例のようなスタイルを与えたい場合、どうすればprefix にアクセスできますか?