css3渐变

css3提供了两种渐变方式：

• 线性渐变（向下/向上/向右/向左/对角/任意角度方向）
• 径向渐变（由中心定义）

用background-image属性来控制渐变

1.线性渐变

为了创建一个线性渐变，你必须至少定义两种颜色结点。颜色结点即你想要呈现平稳过渡的颜色。同时，你也可以设置一个起点和一个方向（或一个角度）。若不指定渐变方向，则默认从上到下

语法：

background-image: linear-gradient(direction, color1, color2, ...);

从上到下的线性渐变：（可以省略direction）

background-image: linear-gradient(#e66465, #9198e5);

从左到右的线性渐变：direction 的值设置为to right

background-image: linear-gradient(to right, #e66465, #e9198e5);

对角方向的渐变：(从左下角到右下角渐变)direction 的值可以设置为to bottom right

background-image: linear-gradient(to bottom right, #e66465, #9198e5);

任意角度渐变：可以使用任意角度渐变，不使用预设方向（to bottom、to top、to right、to left、to bottom right，to top right࿰