试了下 渐变色  ，主要确定开始位置  结束位置，以及对应的color-stop;  以下是兼容不同浏览器的代码片段

 

 

 

代码：
<style type="text/css"> 
.jb_keleyi_com{ 
height: 300px; 
width:100px; 
margin:0px auto; 
background-image: -moz-linear-gradient(top, #00FF00, #FF0000); /*火狐*/
background: -o-linear-gradient(top, #00FF00 0%,red 100%);/*Opera*/
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #00FF00), color-stop(1,#FF0000)); /*Chrome*/
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00FF00', endColorstr='#FF0000', GradientType='0'); /*IE*/
} 
</style>

用CSS是div颜色渐变：<br />
<div class="jb_keleyi_com">从绿到红<br /><br />keleyi.com</div>