<html>
<head>
<title></title>
<style type="text/css">
.linear{
width:100%;
height:600px;
FILTER: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=##15A216,endColorStr=#fafafa); /*IE*/
background:-moz-linear-gradient(top,#15A216,#fafafa);/*火狐*/
background:-webkit-gradient(linear, 0% 0%, 0% 100%,from(#15A216), to(#fafafa));/*谷歌*/
background-image: -webkit-gradient(linear,left bottom,left top,color-start(0, #15A216),color-stop(1, #fafafa));/* Safari & Chrome*/
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#15A216', endColorstr='#fafafa'); /*IE6 & IE7*/
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#15A216', endColorstr='#fafafa')"; /* IE8 */
}
</style>
</head>
<body>
<div class="linear"></div>
</body>
</html>
有這一實例，即可徹底解決漸變色的問題。
css3可以直接設置背景變色。
這是IE的代碼
body
{
filter:progid:DXImageTransform.Microsoft.gradient(startcolorstr=red,endcolorstr=blue,gradientType=1);
}
代碼主要有三個參數，依次是：startcolorstr, endcolorstr, 以及gradientType。
其中gradientType=1代表橫向漸變，gradientType=0代表縱向淅變。startcolorstr=”色彩” 代表漸變漸變起始的色彩，endcolorstr=”色彩” 代表漸變結尾的色彩。
Firefox或是Safari瀏覽器的代碼：
filter:alpha(opacity=100 finishopacity=0 style=1 startx=0,starty=5,finishx=90,finishy=60)
opacity表示透明度，默認的範圍是從0 到 100，finishopacity 是一個可選參數，如果想要設置漸變的透明效果，就可以使用他們來指定結束時的透明度。範圍也是0 到 100。style用來指定透明區域的形狀特徵：0 代表統一形狀，1 代表線形，2 代表放射狀，3 代表矩形。startx
漸變透明效果開始處的 X座標。 starty 漸變透明效果開始處的 Y座標。 finishx 漸變透明效果結束處的 X座標。 finishy 漸變透明效果結束處的 Y座標。
自己試試，這些都是網上有的，我試過，還可以，但是要比較新的瀏覽器，IE要IE8以上吧。谷歌瀏覽器還好點。我覺得爲了IE8以下的瀏覽器也能有漸變的效果還是用圖片比較好，畢竟還有很多人用IE6、IE7的