CSS3で追加された gradient をIEでも使ってみたいの巻。
【グラデーション】
IE 9
IE 9はHTML5 & CSS3に対応したモダンなブラウザです(噂では)。
CSS3 gradientへの対応はちょっと???な感じです。
Compassでグラデーション設定だと…
Compass
@import "compass/css3"; .gradient { @include background(linear-gradient(top, #fcfcfc, #cccccc)); } |
CSS
.gradient { background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #fcfcfc), color-stop(100%, #cccccc)); background: -webkit-linear-gradient(top, #fcfcfc, #cccccc); background: -moz-linear-gradient(top, #fcfcfc, #cccccc); background: -o-linear-gradient(top, #fcfcfc, #cccccc); background: linear-gradient(top, #fcfcfc, #cccccc); } |
こんな感じでベンダープレフィックス付けて吐き出してくれます。
あれ、 -ms
が無い。
IE 9までは背景にグラデーションが有効にならない仕様らしい。
続きを読む →