首页 > 代码库 > 实现渐变色案例
实现渐变色案例
渐变色实现案例:
1 <!DOCTYPE html> 2 <html lang="en"> 3 4 <head> 5 <meta charset="UTF-8"> 6 <title>Document</title> 7 </head> 8 <style type="text/css"> 9 .linear {10 width: 100%;11 height: 600px;12 FILTER: progid: DXImageTransform.Microsoft.Gradient(gradientType=0, startColorStr=#b8c4cb, endColorStr=red);13 /*IE 6 7 8*/14 background: -ms-linear-gradient(top, #9C5560, #fff);15 /* IE 10 */16 background: -moz-linear-gradient(top, #b8c4cb, #f6f6f8);17 /*火狐*/18 background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#b8c4cb), to(#f6f6f8));19 /*谷歌*/20 background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#9C5560), to(#fff));21 /* Safari 4-5, Chrome 1-9*/22 background: -webkit-linear-gradient(top, #9C5560, #fff);23 /*Safari5.1 Chrome 10+*/24 background: -o-linear-gradient(top, #9C5560, #fff);25 /*Opera 11.10+*/26 }27 </style>28 29 <body>30 31 <div class="linear"></div>32 33 </body>34 35 </html>
效果如下:
实现渐变色案例
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。