ホームページ >ウェブフロントエンド >CSSチュートリアル >Internet Explorer で CSS グラデーションはどのように進化しましたか?

Internet Explorer で CSS グラデーションはどのように進化しましたか?

Linda Hamilton
Linda Hamiltonオリジナル
2024-11-21 10:15:09986ブラウズ

How have CSS gradients evolved in Internet Explorer?

Internet Explorer のグラデーション: 進化

Internet Explorer でグラデーションを実装するには、バージョンに応じてベンダー プレフィックスを使用する必要があります。以前のバージョンでは独自のフィルターが使用されていましたが、IE9 ではベンダー プレフィックス付きの CSS グラデーションのサポートが導入されました。

IE9 ベンダー プレフィックス:

IE9 では、グラデーションのベンダー プレフィックスは次のとおりです。 '-ms-':

-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#444444', EndColorStr='#999999')";

追加のベンダー プレフィックス:

他のブラウザーとの互換性のために、追加のベンダー プレフィックスを次のように使用することを検討してください。よく:

background-image: -moz-linear-gradient(top, #444444 0%, #999999 100%); /* Mozilla Firefox */
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #444444), color-stop(1, #999999)); /* Safari/Chrome (old syntax) */

Opera:

Opera のグラデーションのベンダー プレフィックスは '-o-' です:

background-image: -o-linear-gradient(top, #444444 0%, #999999 100%);

モダン構文:

最新のブラウザ (IE10) では、グラデーションを作成する推奨方法は、接頭辞のない 'linear-gradient' キーワードを使用することです:

background-image: linear-gradient(top, #444444 0%, #999999 100%);

この構文は、IE10、Firefox、Safari、Chrome などのすべての主要なブラウザでサポートされています。オペラ。

以上がInternet Explorer で CSS グラデーションはどのように進化しましたか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

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