线性渐变（Linear Gradients）

语法

background: linear-gradient(angle, color-stop1, color-stop2, 3 ,4 ,5…);

angle属性说明：
0度是由下向上渐变；
关键词：

  • to top 0deg
  • to right 90deg
  • to bottom 180deg
  • to left -90deg

径向渐变

语法

background: radial-gradient([position], [shape] [size], color-stop, color-stop…);

属性说明

  • position 渐变的中心
  • shape 形状(圆形(circle)、椭圆(ellipse)
  • size 渐变的大小
    • closest-side 从圆心到距离圆心最近的边
    • closest-corner 最近的角
    • farthest-side 最远的边
    • farthest-corner 最远的角