css渐变分为：1.线性渐变（linear-gradient）

                          2.径向渐变（radial-gradient）

                          3.圆锥渐变（conic-gradient）

    其中线性渐变与径向渐变还可以使用repeating-linera-gradient、repeating-radial-gradient来创建重复渐变。

一、线性渐变

基础线性渐变：要创建最基本的渐变类型，您只需指定两种颜色即可。 这些被称为色标。 至少指定两个色标，也可以指定任意数量。默认从上到下。

设置值将渐变的中心点移动到指定位置：

指定值改变渐变的方向：

对角线渐变：

设置渐变角度，精确控制渐变方向：

使用多种颜色的渐变：

多种颜色渐变设置渐变停止的位置：

在渐变颜色间创建实线(分割线)：

两种对比效果：

支持背景堆叠和透明度：

渐变堆叠渐变：

重复线性渐变：

二、径向渐变

大致与线性类似。

三、圆锥渐变（不常见）

参考链接：

  MDN-使用css渐变

    菜鸟教程-css3渐变

    MDN-圆锥渐变