方法：1、用linear-gradient()实现线性渐变，语法“linear-gradient(角度,起止颜色列表)”；2、用radial-gradient()实现径向渐变，语法“radial-gradient(大小 位置,起止颜色)”。
本教程操作环境：windows7系统、CSS3&&HTML5版、Dell G3电脑。
linear-gradient() 函数--线性渐变
linear-gradient() 函数用于创建一个线性渐变的 "图像"。
创建一个线性渐变，需要指定两种颜色，还可以实现不同方向（指定为一个角度）的渐变效果，如果不指定方向，默认从上到下渐变。
立即学习“前端免费学习笔记（深入）”；
语法：
linear-gradient(direction, color-stop1, color-stop2, ...);
参数：
| 值 | 描述 |
|---|---|
| direction | 用角度值指定渐变的方向（或角度）。 |
| color-stop1, color-stop2,... | 用于指定渐变的起止颜色。 |
代码示例（考虑浏览器兼容性）：
线性渐变 基本线性渐变--自上而下基本线性渐变--45度角
效果图：
radial-gradient()函数--径向渐变
radial-gradient() 函数用径向渐变创建 "图像"。
径向渐变由中心点定义。例：
为了创建径向渐变你必须设置两个终止色。
css径向颜色渐变(Radial Gradients)跟线性渐变(linear gradients)不一样，它不是沿着一个方向渐变，而是以一个点为中心，向四周辐射渐变，360度的。
语法：
radial-gradient(shape size at position, start-color, ..., last-color);
参数值：
| 值 | 描述 |
|---|---|
| shape | 确定圆的类型:
|
| size | 定义渐变的大小，可能值：
|
| position | 定义渐变的位置。可能值：
|
| start-color, ..., last-color | 用于指定渐变的起止颜色。 |
示例：
径向渐变 - 形状
椭圆形 Ellipse（默认）：
圆形 Circle：
注意： Internet Explorer 9 及之前的版本不支持渐变。
效果图：
径向渐变 径向渐变径向渐变
（学习视频分享：css视频教程）
