6

CSS3 ルールは、多くの興味深い機能をもたらします。

たとえば、border-radiusを取ります。標準では、このルールを記述すると次のようになります。

div.rounded-corners {
  border-radius: 5px;
}

5px の境界半径を取得する必要があります。

しかし、mozilla も Webkit もこれを実装していません。ただし、これらは同じものを同じパラメーターで異なる名前 (それぞれ-moz-border-radiusと-webkit-border-radius) で実装します。

できるだけ多くのブラウザーを満足させるために、次のようになります。

div.rounded-corners {
  border-radius: 5px;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
}

明らかな欠点が 2 つあります。

  • コードをコピーして貼り付けます。これには、ここでは説明しない明らかなリスクがあります。
  • W3C CSS バリデーターは、これらのルールを検証しません。

同時に、明らかな利点は見当たりません。

mozilla と webkit の背後にいる人々は、私よりも知的な人たちだと思います。このように物事を構造化するのには、いくつかの正当な理由があるに違いありません。見えないだけです。

だから、私はあなたに尋ねなければなりません：これはなぜですか？

4

4 に答える 4

6

は-moz-border-radiusMozilla のセマンティクスを説明しています。CSS3 が異なるセマンティクスで公開された場合、Mozilla は常にそれらのborder-radiusセマンティクスを使用して実装でき、誰の Web サイトも破壊しません。

一方、border-radius直接使用しただけの場合、CSS3 が異なるセマンティクスで公開された場合、Mozilla は人々のサイトを破壊するか、非標準の CSS を永久にサポートするかを選択する必要があります。

于 2010-05-28T17:07:01.160 に答える
3

完全にサポートされていないため、これを行います。そのコードをベータ版にするのとよく似ています。最終的には、border-radius のサポートが追加される予定です。

線形グラデーションを見ると、より明白になります。

background-image: -moz-linear-gradient(100% 100% 90deg, #2F2727, #1a82f7);
background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#1a82f7), to(#2F2727));

同じ構文を使用していないことに注意してください。彼らが最終的に標準に同意すると、線形勾配のサポートが追加され、正しい構文が使用されます。

于 2010-05-28T17:04:42.027 に答える
2

2010-09-14の時点で、-moz プレフィックスが border-radius から削除されたことに注意してください。これは、Firefox 4 がプレフィックスなしの border-radius をサポートすることを意味します。

于 2010-09-15T21:33:48.827 に答える
2

単純。プロプライエタリなバリアントは-moz、CSS3 勧告に組み込まれる前に-webkit存在していました。彼らは独自の実装を持っていましたが、これらが W3C の最終的な推奨事項と一致するかどうかはわかりませんでした。したがって、彼らは後で物事を壊さないように、その時点でも現在の正式な名前を使用しませんでした.border-radius

于 2010-05-28T17:07:40.660 に答える