CSS3线性渐变linear-gradient

渐变就是从一种颜色过渡到另一种颜色的填充过程，两种颜色相交时会进行混合，渐变的类型有两种：
1、线性渐变（linear）：通过linear-gradient函数定义
2、径向渐变（radial）：通过radial-gradient函数定义
语法：
线性渐变：background：linear-gradient（方向，颜色，…)
重复线性渐变：repeating-linear-gradient（方向，颜色，…)
渐变方向（或角度）：
to left：设置渐变为从右到左 相当于：270deg
to right：设置渐变从左到右 相当于：90deg
to top：设置渐变从下到上 相当于：0deg
to bottom：设置渐变从上到下 相当于：180deg（默认值）
to left top：设置渐变为从右下到左上
to right top：设置渐变为从左下到右上
to bottom left：设置渐变为从右上到左下
to bottom right：设置渐变为从左上到右下
我们来看看linear-gradient的具体用法：
这里是一个线性渐变从中间（水平方向）和顶部（垂直方向）开始，起始于蓝色，过渡到白色.
![在这里插入图片描述](https://img-blog.csdnimg.cn/20191119110157470.jpg

代码片段如下：