css3渐变

/* 线性渐变 */
.linear-gradient {
  background: linear-gradient(to right, red, orange);
}

/* 径向渐变 */
.radial-gradient {
  background: radial-gradient(circle, red, orange);
}

/* 角度渐变 */
.angle-gradient {
  background: linear-gradient(45deg, red, orange, yellow);
}

/* 多颜色渐变 */
.multi-color-gradient {
  background: linear-gradient(to bottom, red, orange, yellow, green, blue, indigo, violet);
}

解释说明：

1. 线性渐变：linear-gradient(to right, red, orange) 创建了一个从左到右的线性渐变，颜色从红色过渡到橙色。
2. 径向渐变：radial-gradient(circle, red, orange) 创建了一个圆形的径向渐变，颜色从中心向外由红色过渡到橙色。
3. 角度渐变：linear-gradient(45deg, red, orange, yellow) 创建了一个45度角的线性渐变，颜色从红色过渡到橙色再到黄色。
4. 多颜色渐变：linear-gradient(to bottom, red, orange, yellow, green, blue, indigo, violet) 创建了一个从上到下的线性渐变，包含多种颜色的过渡。