css渐变

 css渐变

　一.分类

　　　1.线性渐变：向上，向下，向左，向右，对角线。

　　　2.径向渐变：由其中心定义

　二.渐变

　　　1.需要至少两个色标，色标是呈现平滑过渡的颜色，还可以设置起点和方向（默认的方向是自上而下）。

　　　2.语法为:backgroud-image:linear-gradient(方向，颜色1，颜色2，...)

　　　3.方向：to right（从左到右），to buttom right（从左上到右下），如果希望对渐变角度做更多的控制，您可以定义一个角度，来取代预定义的方向（向下、向上、向右、向左、向右下等等）。值 0deg 等于向上（to top）。值 90deg 等于向右（to right）。值 180deg 等于向下（to bottom）。

   三.通过透明度来实现渐变

           1.rgba函数：在rgb的基础上添加了一个alpha，a的值为0到1,0表示完全透明，1表示无透明，然后加入线性渐变中

            代码：background-image: linear-gradient(to right, rgba(255,0,0,0), rgba(255,0,0,1)); 从红色的透明自左向右成为不透明