div+css背景渐变色代码示例


用CSS使DIV背景颜色渐变,适用于IE和Chrome等浏览器。

从黄到红示例:http://keleyi.com/keleyi/phtml/divcss/2.htm

代码:

<style type="text/css"> 
.jbkeleyi{ 
height: 300px; 
width:100px; 
margin:0px auto; 
background-image: -moz-linear-gradient(top, #F00, #000); 
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #00FF00), color-stop(1,#FF0000)); 
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00FF00', endColorstr='#FF0000', GradientType='0'); 
} 
</style> 
</head>
<body>
用CSS是div颜色渐变:<br />
<div class="jbkeleyi">从绿到红<br /><br />keleyi.com</div> 

效果图:

另外多浏览器兼容代码:

FILTER: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=#b8c4cb,endColorStr=#f6f6f8);    /*IE*/

background:-moz-linear-gradient(top,#b8c4cb,#f6f6f8);/*火狐*/

background:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#b8c4cb), to(#f6f6f8));/*谷歌*/

更详细内容请参考:http://keleyi.com/a/bjac/cp4alo5k.htm


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM