线性渐变和径向渐变

1 , 线性渐变
linear-gradient([方向 ,] color1 距离 , color2 距离,...)
<!--
    方向:right/left/top/bottom/to right/0deg
    距离:10px/10%
-->
2 , 径向渐变
radial-gradient(中心点(x,y) ,渐变的形状 , 渐变的大小 , color1 距离1 , color2 距离2  )
<!--
    中心点: %/px
    渐变的形状:
        circle 表示圆形
        ellipse 表示椭圆形(默认)
    渐变的大小
        closest-side
        farthest-side
        closest-corner
        farthest-corner
-->