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

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

Linda Hamilton
リリース: 2024-11-21 10:15:09
オリジナル
966 人が閲覧しました

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 サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート