css背景渐变

作者：冫LOVE灬丶棒棒发布日期:2025-06-25 浏览:41

/* 线性渐变 */
background: linear-gradient(to right, red, yellow);

/* 解释说明：
- `linear-gradient` 函数用于创建一个线性渐变的背景。
- `to right` 表示渐变的方向是从左到右。
- `red` 和 `yellow` 是渐变的起始颜色和结束颜色。
*/

/* 径向渐变 */
background: radial-gradient(circle, red, yellow);

/* 解释说明：
- `radial-gradient` 函数用于创建一个径向渐变的背景。
- `circle` 表示渐变的形状是圆形。
- `red` 和 `yellow` 是渐变的起始颜色和结束颜色。
*/

/* 多色渐变 */
background: linear-gradient(to right, red, orange, yellow, green, blue, indigo, violet);

/* 解释说明：
- 这是一个多色线性渐变的例子。
- 渐变的方向仍然是从左到右。
- 颜色依次为红、橙、黄、绿、蓝、靛、紫，形成彩虹效果。
*/

上一篇：css 上下居中

下一篇：css字体样式