2

私はこのコードをChromeとFirefoxではうまくいきましたが、IE9ではうまくいきません。このページMultiple backgroundbackground-sizeによるIE9IE 9背景に画像がないCSSグラジエント

span.select { 
    position: absolute; 
    bottom: 0; 
    float: left; 
    left: 0; 
    line-height: 1; 
    text-indent: 10px; 
    background: #ffffff; 
    background: url(../img/color-arrow.png) no-repeat, linear-gradient(top, #ffffff 0%,#a9a9a9 100%); 
    cursor: default; 
    z-index: 1; 
    border: #dadada 1px solid; 
    border-radius: 4px; 
    background-position: 100% center; 
    background-size: 1.5em 0.6em, 100% 100%; 
    text-shadow: 0px 1px 1px #fff; 
    white-space: nowrap } 

でサポートされて私は、複数の背景や背景、それに

答えて

2

IE9 Doesn't support gradients. IE10 supports them unprefixedのサイズを変更を使用しています。しかし、IE9はSVGを実装しました。

colorzilla's gradient editorをお勧めします。 SVGをフォールバックとして使用するには、 "IE9 Support"チェックボックスをオンにしてください。

IE8で勾配が本当に必要な場合(漸進的な拡張にのみ使用する必要があるため)、IE's proprietary filter propertyを使用できますが、非常にバグがありますので注意してください。

+0

私は '-ms-'を追加しましたが、複数のバックグラウンドが動作していないので表示されません –

+0

-ms-接頭辞は私が知る限りIE10のサポート用です。独自のフィルタがいくつかあります。これはIE9やいくつかの古いバージョンでサポートされています。 – Dmitriy

+0

@Dmitriy IE10は未勾配の勾配をサポートしています。 '-ms-'プレフィックスの必要はありません。回答が編集されました。 –

2

IE9は複数の背景をサポートします画像をサポートしますが、複数の背景要素を組み合わせることはできません。問題は画像とグラデーションです。

さらに、-ms-は、CSS互換のために何もしません。

+0

「背景要素」という用語は間違っています。線形勾配は、単に生成された*背景画像です。 – PointedEars

+0

@PointedEars - 私は反対する必要があります。 「要素」とは、任意の数の項目、グラデーション、イメージ、色を指します。 – Scott

+1

"要素"はすでにマークアップ言語で使用されているため、 "値"を使用することをお勧めします。 – PointedEars