CSS3 属性の前に Webkit を追加する必要があるのはなぜですか?-CSSチュートリアル-php.cn

ホームページ

ウェブフロントエンド

CSSチュートリアル

CSS3 属性の前に Webkit を追加する必要があるのはなぜですか?

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB

Dec 16, 2021 pm 03:43 PM

css

CSS はさまざまなブラウザの属性サポートと互換性がある必要があるため、ブラウザの製造元は新しい属性をサポートするために属性の前にプライベートプレフィックスを追加します。プレフィックス「-webkit-」の付いた属性は webkit- で使用できます。 based 通常、「safari」や「chrome」ブラウザなどで使用されます。

CSS3 属性の前に Webkit を追加する必要があるのはなぜですか?

このチュートリアルの動作環境: Windows 10 システム、CSS3&&HTML5 バージョン、Dell G3 コンピューター。

Css3 属性の前に Webkit を追加する理由

CSS3 には、box-reduis、box-orient、 text-overflow など、これらの属性は以前のバージョンでは存在しなかったか、サポートされていなかったため、さまざまなブラウザに対して、これらの新しい属性を解析できるようにカーネル名が指定されています。これは合理的な説明のようです。つまり、-moz- は Firefox 用で、-webkit- は safari と chrome 用です。

-moz は Firefox ブラウザのプライベートプロパティを表します
-ms は ie ブラウザのプライベートプロパティを表します
-webkit は safari と chrome のプライベート属性を表します

標準が決定される前に、一部のブラウザは、safari と chrome との互換性を維持するために、初期ドラフトに従ってすでにいくつかの機能を実装していました。後で決定された標準であるため、各ブラウザは標準と区別するために独自のプライベートプレフィックスを使用します。標準が確立されると、主要なブラウザはプレフィックスのない新しい CSS3 属性を徐々にサポートすることになります。

例は次のとおりです:

<html>
<head>
<style> 
div
{
width:300px;
height:100px;
background-color:#ff9900;
-moz-box-shadow: 10px 10px 5px #888888; /* 老的 Firefox */
box-shadow: 10px 10px 5px #888888;
}
</style>
</head>
<body>
<div></div>
</body>
</html>

なぜプライベートプレフィックスが必要なのでしょうか?それは、HTML と CSS の標準を策定する組織である W3C が非常に遅いからです。通常、w3c 組織のメンバーが、rounded border-radius などの新しい属性を提案し、誰もがそれが良いと考えるのですが、w3c はこの属性の標準を設定せず、非常に複雑なプロセスを経て、たくさんのレビュー。

ブラウザベンダーは、属性が十分に成熟していると判断した場合、ブラウザにサポートを追加する予定です。ただし、将来 w3c が標準を発表するときに変更を避けるために、事前に新しい属性をサポートするために -webkit-border-radius などのプライベートプレフィックスが追加されます。 border-radius が確立され、ブラウザの新しいバージョンが border-radius の書き込み方法をサポートするようになります。

たとえば、Chrome 10 は border-radius を認識せず、webkit-border-radius のみを使用できますが、Chrome 12 はこれを認識できます。そのため、CSSを記述する場合、このように記述することで、Webページを閲覧するときにChrome10とChrome12の両方が正しく表示されるようにすることができます。

書き込めなくなったプライベートプレフィックスが多数ありますが、古いバージョンのブラウザとの互換性を保つために、プライベートプレフィックスと標準メソッドを引き続き使用でき、段階的に移行できます

(ビデオ共有の学習: css ビデオチュートリアル)

以上がCSS3 属性の前に Webkit を追加する必要があるのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明

この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。