css 渐变背景色

作者：视同仁寤戬发布日期:2025-07-13 浏览:88

/* 渐变背景色示例 */

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

/* 解释：从左到右的线性渐变，起始颜色为红色，结束颜色为黄色。 */

/* 径向渐变 */
div {
  background: radial-gradient(circle, blue, green);
  width: 300px;
  height: 300px;
}

/* 解释：以圆形为中心的径向渐变，起始颜色为蓝色，结束颜色为绿色。 */

/* 角度渐变 */
section {
  background: linear-gradient(135deg, purple, orange);
  width: 300px;
  height: 300px;
}

/* 解释：从135度方向开始的线性渐变，起始颜色为紫色，结束颜色为橙色。 */

上一篇：css径向渐变

下一篇：css 文本超出就隐藏并且显示省略号