IE9でもグラデーションを表示することができる「SVG Gradient Background Maker」

現在、IE9はCSS3でグラデーションを適用させることができません。そこでIE9でも簡単にグラデーションを表示させることができるジェネレーターを見つけたのでシェアしたいと思います。

SVG Gradient Background Maker

SVG Gradient Background Maker

↓グラデーションスタイルとして線形か円形かを選択

↓色を変更、追加していきます。

↓例としてstopを1つ追加してみました。

↓グラデーションの始点を選択

↓プレビュー

↓CSSのソースが出力されるのでコピーして自分のCSSファイルの指定の場所に貼り付けます。

プレビュー

↓IE9で確認してみてください。ちゃんとグラデーションが適用されていると思います。
CSS3で作る巨大RSSアイコン

IE8以前にもCSS3を適用したい場合・・・

CSS3 PIE: CSS3 decorations for IE

IE6〜IE8でCSS3が使えるツールです。スタイルシートに「behavior: url(PIE.htc);」の1行を追加するだけでCSS3が利用できます。ただしダウンロードした「PIE.htc」ファイルを、サーバーにアップロードする必要があります。

CSS3 PIEもいずれ実験してみたいと思います。