彩色渐变字体
也就是所谓的c3动画，用 @keyframes 定义一个动画效果，然后添加到字体上，从0%开始定义状态到100%，规定动画时间，改变速度跟无限循环；背景颜色如下:
background: -webkit-linear-gradient(left,#ffffff,#ff0000,#ff7d00,#ffff00,#00ff00,#00ffff,#0000ff,#ff00ff,
#ffff00,#ff0000,#ff7d00,#ffff00,#00ff00,#00ffff,#0000ff,#ff00ff,#ffff00
);
调用如下：animation: computer 7s linear infinite;
把他的背景尺寸设置成background-size:200%;然后利用背景色的定位，使其实现滚动效果；
@keyframes computer {0% {background-position: 0 0;}100% {background-position: -100% 0; }}
需要注意的是：background-clip这个属性，他用来设置裁剪背景的区域，我们需要设置成text文本；text-fill-color这个属性用来设置填充色，如果设置了color，color将被覆盖；
以下是我自己的理解：
如果我们去掉background-clip: text;这个属性的话就会看到，背景其实变成了一条色带；通过“背景裁剪”background-clip这个属性，把文本字体轮廓保留；然后去设置背景的样式变化；只有字体那个地方是存在且空白的，其他的地方全部被隐藏了，字体固定了位置保持不变，然后背景在下面匀速滚动，我们就看到了这种样式的字体；
当然，也可以设置成背景图片，用background-size属性设置背景图片尺寸；然后你会发现，图片运行到最后，你会发现“跳图”；把最后的background-position设置成：
-200% 0；正好完美衔接；
刚接触前端没多久，平常喜欢逛逛博客园。我看到了博主妖色调的博客，很炫的效果，就去研究了一下。他的页面有很多好玩的东西，也发表了很多文章，大家可以去看看。
大哥博客：
妖色调