怎么用CSS3中的gradient属性做出背景渐变效果

小编给大家分享一下怎么用CSS3中的gradient属性做出背景渐变效果，希望大家阅读完这篇文章之后都有所收获，下面让我们一起去探讨吧！
　　浏览器支持两种类型的渐变：
　　linear,用linea免费云主机、域名r-gradient()函数定义,
　　radial,用radial-gradient()函数定义.
　　使用过程中注意浏览器的兼容问题
　　Safari，Chrome：-webkit-linear-gradient
　　Firefox：-moz-linear-gradient
　　IE：-ms-linear-gradient
　　Opera：-o-linear-gradient
　　本篇文章将以Chrome浏览器为例进行讲解
　　线性渐变
　　要创建线性渐变，将起点和方向设置为角度，还要定义颜色停止必须指定至少两个停止颜色。
　　从顶部到底部的线性渐变
　　div{
　　/*倒退*/
　　width:200px;
　　height:200px;
　　background-color:#1a82f7;
　　background-repeat:repeat-x;
　　background:-webkit-linear-gradient(top,#2F2727,#1a82f7);
　　}
　　从左到右的渐变过程
　　div{
　　/*倒退*/
　　width:200px;
　　height:200px;
　　background-color:#1a82f7;
　　background-repeat:repeat-x;
　　background:-webkit-linear-gradient(left,#2F2727,#1a82f7);
　　}看完了这篇文章，相信你对“怎么用CSS3中的gradient属性做出背景渐变效果”有了一定的了解，如果想了解更多相关知识，欢迎关注云技术行业资讯频道，感谢各位的阅读！

相关推荐: css动画是如何组成的

小编给大家分享一下css动画是如何组成的，相信大部分人都还不怎么了解，因此分享这篇文章给大家参考一下，希望大家阅读完这篇文章后大有收获，下面让我们一起去了解一下吧！ css动画是由关键帧、动画属性和css属性三部分组成的。关键帧用于定义动画在不同阶段的状态；动…