IE9 以降で CSS グラデーションを実装するにはどうすればよいですか?

Internet Explorer 9 以降のグラデーション

ご存知のとおり、Internet Explorer でのグラデーションの実装は、過去。しかし、Microsoft は IE9 でついに CSS グラデーションのサポートを導入し、Web デザイナーに新たな可能性をもたらしました。

IE9 でグラデーションを作成するには、次の構文を使用できます:

background-image: -ms-linear-gradient(top, #444444, #999999);

これにより、上部の #444444 から下部の #999999 に移行する線形グラデーションが作成されます。

他のブラウザのベンダー プレフィックス

他のブラウザの場合は、次のベンダー プレフィックスを使用する必要があります:

• Mozilla Firefox: -moz-linear-gradient
• Apple Safari および Google Chrome: -webkit-gradient
• Opera: -o-linear-gradient

複数のブラウザ用のコード例

でグラデーションをサポートするには複数のブラウザでは、次の CSS を使用できます。コード:

background-image:
    -ms-linear-gradient(top, #444444, #999999),
    -moz-linear-gradient(top, #444444, #999999),
    -webkit-gradient(linear, left top, left bottom, color-stop(0%, #444444), color-stop(100%, #999999)),
    -webkit-linear-gradient(top, #444444, #999999),
    -o-linear-gradient(top, #444444, #999999);

Opera Vendor Prefix

あなたが正しく述べたように、Opera のベンダー プレフィックスは次のとおりです:

• -o -linear-gradient

出典: http://ie.microsoft.com/testdrive/Graphics/CSSGradientBackgroundMaker/Default.html

以上がIE9 以降で CSS グラデーションを実装するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。