线性渐变
background-image: linear-gradient( 角度 , 颜色);
线性渐变是最基本的渐变类型。这种渐变在一条直线上从一个颜色过渡到另一个颜色。
####background-image: linear-gradient( #E94E65, #1574A8);
这条直线的方向由角度指定，或者在关键字 to 后面加上 top、bottom、right、left 中的某一个关键字或多个关键字，例如 to bottom left。
background-image: linear-gradient( to right, #E94E65, #1574A8);
这样渐变是从元素左边的红色过度到右边的蓝色
如果渐变是从元素上边的紫色过度到下边的绿色，要使用 to bottom 关键字。
background-image: linear-gradient(to bottom , #7A88FF, #7AFFAF);
另外，还可以用 to bottom right 这样的关键字指定渐变的角度。使渐变从元素的左上角开始，到元素的右下角结束。
bac
background-image: linear-gradient(to bottom right, #7A88FF, #7AFFAF);
径向渐变
background-image: radial-gradient();
径向渐变就是沿着圆周或者椭圆周向外扩散的渐变。
background-image: radial-gradient( #E94E65, #1574A8);
述代码会在元素的显示范围内创建一个椭圆形，把渐变的中心点（红色）放在元素的中心上。
我们还可以在颜色值前面加上 circle 关键字，创建圆形的渐变。
background-image: radial-gradient( circle, #E94E65, #1574A8);
设置径向渐变的中心点
可以用关键字 at 后面加上 background-position 属性支持的定位关键字和数值，指定渐变中心的位置,设置在元素的左上方（20% 20%）
background-image: radial-gradient( circle at 20% 20%, #E94E65, #1574A8);
closest-side：告诉浏览器从中心点向外扩展渐变，到离中心点最近的一边结束。
background-image: radial-gradient(closest-side at 20% 20%, #E94E65, #1574A8);
background-image还有很多玩法 剩下的我就不展示了，把方法写在这里。
arthest-corner：以离渐变中心点最远的顶角计算圆的半径
losest-corner：以离渐变中心点最近的元素顶角计算渐变的范围。
farthest-side：以离渐变中心点最远的那一边计算圆的半径。