css渐变色

/* 渐变色示例代码 */

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

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

/* 角度线性渐变 */
.angled-linear-gradient {
  background: linear-gradient(45deg, red, orange, yellow, green, blue, indigo, violet);
}

/* 多颜色停止点的线性渐变 */
.multi-stop-linear-gradient {
  background: linear-gradient(to right, red 0%, orange 25%, yellow 50%, green 75%, blue 100%);
}

解释说明：

• 线性渐变 (linear-gradient)：颜色从一个方向逐渐过渡到另一个方向。to right 表示颜色从左到右过渡。
• 径向渐变 (radial-gradient)：颜色从一个中心点向外扩散，形成圆形或椭圆形的渐变效果。
• 角度线性渐变：通过指定角度（如 45deg），可以控制渐变的方向。
• 多颜色停止点的线性渐变：可以在渐变中指定多个颜色及其位置（百分比），从而实现更复杂的渐变效果。