CSS随机更改文本颜色答案

【问题标题】：CSS Change Text Color RandomlyCSS随机更改文本颜色
【发布时间】：2014-08-26 13:50:03
【问题描述】：

我知道如何用 JS 来实现，但是在 http://daneden.github.io/animate.css/Animate.css 中的文字变化非常流畅，而且上面没有 JS！

谁能解释一下？

谢谢

【问题讨论】：

【解决方案1】：

h1 {
    color: #f35626;
    background-image: -webkit-linear-gradient(92deg, #f35626, #feab3a);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    -webkit-animation: hue 60s infinite linear;
}

@-webkit-keyframes hue {
    from {
      -webkit-filter: hue-rotate(0deg);
    }

    to {
      -webkit-filter: hue-rotate(360deg);
    }
}

对于这样的标记

<h1>CHANGE COLOR TEXT</h1>

您可以在此处查看示例：http://jsfiddle.net/3oqep26z/

修改动画时间以加快颜色变化

【讨论】：

哦，谢谢。我看到这是一种很酷的方式来添加渐变和改变饱和度的颜色，比如 Photoshop。但它只是 webkit。为什么好东西只有webkit！！！无论如何，我使用它，对于非 webkit 浏览器，我使用颜色。谢谢。

【解决方案2】：

我的猜测是它会使用 CSS3 我在网上找到了这个

http://imajineweb.com/csstexthover

【讨论】：

【解决方案3】：

这是 css3 功能。不适用于任何地方

以某种风格设置动画：

-webkit-animation-duration: 10s;

给它命名

-webkit-animation-name: colours;

并以您需要的方式使用

@-webkit-keyframes colours {
      0% {background-color: #39f;}
     15% {background-color: #8bc5d1;}
     30% {background-color: #f8cb4a;}
     45% {background-color: #95b850;}
     60% {background-color: #944893;}
     75% {background-color: #c71f00;}
     90% {background-color: #bdb280;}
    100% {background-color: #39f;}
}

示例： http://jsfiddle.net/gk37un0r/

【讨论】：

我知道这一点。但这不是网站中的内容。无论如何，我得到了另一个答案