我注意到了這一點正在使用的服務,而且效果看起來超極用CSS創建漸變最簡單的跨瀏覽器兼容方式是什麼?
-moz-linear-gradient(center top , #E3EBF3, #D5E1ED) repeat scroll 0 0 transparent
我注意到了這一點正在使用的服務,而且效果看起來超極用CSS創建漸變最簡單的跨瀏覽器兼容方式是什麼?
-moz-linear-gradient(center top , #E3EBF3, #D5E1ED) repeat scroll 0 0 transparent
就像你在你的問題有使用CSS屬性。添加-moz
,-webkit
前綴,然後使用它前綴。
IE's filter
property can do gradients。這是恰當的,但它的工作原理:)
http://www.colorzilla.com/gradient-editor/
使用Modernizr的一些IE是否在塊頂部類添加到您的HTML標記,這樣就可以提供有效的HTML和CSS,和黑客&屬性那些必要的。
例如,在一個坡度,我在過去使用:
body {
background: #2688cf;
}
.cssgradients body{
background: -moz-linear-gradient(top, #2688cf 0%, #2989d8 12%, #207cca 14%, #62a2d6 18%, #b9d5ea 28%, #ffffff 40%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#2688cf), color-stop(12%,#2989d8), color-stop(14%,#207cca), color-stop(18%,#62a2d6), color-stop(28%,#b9d5ea), color-stop(40%,#ffffff));
background: -webkit-linear-gradient(top, #2688cf 0%,#2989d8 12%,#207cca 14%,#62a2d6 18%,#b9d5ea 28%,#ffffff 40%);
background: -o-linear-gradient(top, #2688cf 0%,#2989d8 12%,#207cca 14%,#62a2d6 18%,#b9d5ea 28%,#ffffff 40%);
background: linear-gradient(top, #2688cf 0%,#2989d8 12%,#207cca 14%,#62a2d6 18%,#b9d5ea 28%,#ffffff 40%);
}
.ie6 body, .ie7 body, .ie8 body, .ie9 body {
background: -ms-linear-gradient(top, #2688cf 0%,#2989d8 12%,#207cca 14%,#62a2d6 18%,#b9d5ea 28%,#ffffff 40%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#2688cf', endColorstr='#ffffff',GradientType=0);
background: linear-gradient(top, #2688cf 0%,#2989d8 12%,#207cca 14%,#62a2d6 18%,#b9d5ea 28%,#ffffff 40%);
}
所以像往常一樣,我需要定義幾個不同的風格得到它的跨瀏覽器工作。 =) – 2010-11-05 18:33:50
@明yeow是啊,但嘿,至少IE可以被迫播放好:) – alex 2010-11-06 13:25:48