1. 程式人生 > >background:-webkit-gradient()背景漸變屬性

background:-webkit-gradient()背景漸變屬性

background: -moz-linear-gradient(top,  #bccfe3 0%, #d2dded 100%);  適合 FF3.6+

background: -webkit- gradient(linear, left top, left bottom, color-stop(0%,#bccfe3), color- stop(100%,#d2dded)); 適合 Chrome,Safari4+

background: -webkit-linear-gradient(top,  #bccfe3 0%,#d2dded 100%);  適合Chrome10+,Safari5.1+

background: -o-linear-gradient(top,  #bccfe3 0%,#d2dded 100%);  適合Opera 11.10+

background: -ms-linear-gradient(top,  #bccfe3 0%,#d2dded 100%); 適合IE10+

background: linear-gradient(top,  #bccfe3 0%,#d2dded 100%);     適合W3C

filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#B2FFFFFF', endColorstr='#00FFFFFF',GradientType=0 ); /* IE6-9 */

背景使用CSS漸變顯示可以不使用影象就實現兩個或兩個以上的指定顏色的平滑過渡。這反過來又減少了下載時間和頻寬的使用,放大時也比較好看,可以讓您創造出一個更靈活的佈局。

Firefox支援兩種型別的CSS漸變:線性的(-moz-linear-gradient)和放射狀的(-moz-radial-gradient)。