css文字颜色渐变

作者：还依然存在发布日期:2026-01-05 浏览:87

/* 使用 CSS 渐变实现文字颜色渐变效果 */

h1 {
  background: -webkit-linear-gradient(#ff7e5f, #feb47b); /* 设置背景为线性渐变 */
  -webkit-background-clip: text; /* 将背景剪裁为文字形状 */
  -webkit-text-fill-color: transparent; /* 文字填充颜色设置为透明，显示背景渐变 */
}

/* 解释说明：
1. `background: -webkit-linear-gradient(#ff7e5f, #feb47b);` 设置背景为从 #ff7e5f 到 #feb47b 的线性渐变。
2. `-webkit-background-clip: text;` 将背景剪裁为文字的形状，使得背景渐变只在文字部分显示。
3. `-webkit-text-fill-color: transparent;` 将文字的颜色设置为透明，从而显示背景渐变效果。
*/

上一篇：css的三种引入方式

下一篇：border在css中是什么意思