渐变CSSlinear-gradient

1. **渐变**

渐变（ Gradient ）是 CSS3 介绍了特征定义 CSS Images Module Level 3它本质上是一个 2D 可以应用于图像 background - image 、 list - style - image 和 border 等待微妙的色彩。

1. **固有的梯度本身没有大小,虽然梯度箱都有一个特定的大小**

要指定一个渐变效果,只需定义这三个元素:

• 渐变线（ gradient line ）
• 在梯度线(起点 starting point )和终点( ending point ）
• 开始点和结束点的颜色值

这种方式,将顺利填补剩下的颜色梯度线。

渐变类型、几何可以:

• 线段（ line ）：对应 CSS 线性梯度( linear gradient ）
• 射线（ ray ）：对应 CSS 径向渐变( radial gradient ）
• 螺旋（ spiral ）：对应 CSS 锥形梯度( conic gradient ）

类型的语法:

 =  |  |

              |  |

               | 

1. **梯度的三个元素:梯度线,开始和结束点,和颜色序列**

语法是：

linear-gradient() = linear-gradient(

    [  | to  ]?,

    

)

/*

参1：角度/颜色梯度方向

to top, to right, to bottom, to left，对应到分别是 0deg, 90deg, 180deg, 270deg

参2:梯度特定的颜色 可以接受多种颜色

*/

举例：