●css3 test:画像を使わないグラデーションボタン

CSS3ボタンテスト

CSS3グラデーション

webサービス:
Ultimate CSS Gradient Generatorで作成したグラデーション
http://www.colorzilla.com/gradient-editor/

background: #cb60b3; /* old browsers */---(1)

background: -moz-linear-gradient(top, #cb60b3 0%, #c146a1 50%, #a80077 51%, #db36a4 100%); /* firefox */---(2)

background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#cb60b3), color-stop(50%,#c146a1), color-stop(51%,#a80077), color-stop(100%,#db36a4)); /* webkit */---(3)

filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cb60b3', endColorstr='#db36a4',GradientType=0 ); /* ie */---(4)

(1)古いブラウザ用ではグラデーションを無視させる
(2)Firefox用
(3)Chrome、Safariなど用
(4)IE用

※IE用では簡易的なグラデーションになります。