2012-03-13 11 views
0

私はIE9でこの作業をどのように行うことができるかを知っています。 トップはFirefoxでうまくいきますが、IE9用の2番目のものを追加するとうまくいきません。 私が間違っていることは何か考えてください。IE9勾配-ms

background: -moz-linear-gradient(top, rgba(117,117,117,1) 0%, rgba(111,111,111,1) 5%, rgba(102,102,102,1) 11%, rgba(39,39,39,1) 42%, rgba(28,28,28,1) 50%, rgba(0,0,0,1) 53%, rgba(0,0,0,1) 100%); /* FF3.6+ */ 

    background: -ms-linear-gradient(top left, rgba(117,117,117,1) 0%, rgba(117,117,117,1) 5%,rgba(102,102,102,1) 11%, rgba(39,39,39,1) 42%, rgba(28,28,28,1) 50%, rgba(0,0,0,1) 53%, rgba(0,0,0,1) 100%); 

私はPIEを使用しません。

+1

IE9はそうした勾配をしません。IE10はおそらくそうです。 IE9では 'filter'を使う必要があります。 [この質問](http://stackoverflow.com/questions/3934693/gradients-in-internet-explorer-9)を参照してください – Gareth

+0

私はフィルタを使用して、上記の効果を得ることができます。 -mozと一致する例を教えてもらえますか?私は複数の停止を追加できるようにする必要があります。ありがとう – Chapsterj

答えて

1

これを試してみてください - Ultimate CSS Graident Generator

は、ページの右下に「IE9のサポート」チェックボックスをクリックします。

+0

SVGの読み込みイメージを教えてください。 mage/svg + xml; base64、PD94bWwgdmVyc .........)これは何で、どのように動作するのですか? – Chapsterj

0

IE9は、グラデーションをサポートしていません - だけでIE10:http://caniuse.com/#search=gradient

代わりに、私はIEでのコーディングをスピードアップするために、このようなものを使用してお勧めします:http://www.bradshawenterprises.com/blog/2010/dynamically-drawing-gradients-with-php/

私は通常のPNGを生成するためにこれを使用します私のためのグラデーションは、最初にバックグラウンドとしてそれを設定し、その後CSSのgradと別のプロパティを持っている。これにより、IEだけでなく、グラデーションをサポートしない古いブラウザでも動作します。

これはまた、仕様が変更されたときに私のサイトがまだ機能していたことを意味していました。

また、http://css3pie.com/を使用してください。私はgradsの方が気に入らないのですが。

0

他の回答に記載されているように、-msという接頭辞はIE10 +用です。 IE9は古いfilter構文もサポートしていないので、純粋なCSSでグラデーションを実際にレンダリングすることはできません。

これに対する1つの解決策は、background-imageプロパティのSVGグラジエントの使用です。 http://css3wizardry.com/2010/10/29/css-gradients-for-ie9/