css text gradient All In One

    css text gradient, css fonts gradient

.gradient-colors {
    background-image: linear-gradient(to left, violet, indigo, blue, green, yellow, orange, red);
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
    // -webkit-background-size: 200% 100%;
}

online demo

bug, 文字过少，渐变看不到 ?

linear-gradient

.colors {
  background: linear-gradient(135deg, #0f0, #f0f, #00f);
}

.colors {
  background: linear-gradient(to right bottom, #0f0, #f0f, #00f);
}

refs

https://developer.mozilla.org/en-US/docs/Web/CSS/gradient/linear-gradient()

?xgqfrms 2012-2020

www.cnblogs.com/xgqfrms 发布文章使用：只允许注册用户才可以访问！

原创文章，版权所有??xgqfrms, 禁止转载 ???，侵权必究??！