纯CSS实现彩色文字/文字渐变

利用CSS实现多彩文字：

设置样式：
h3 {
  font-size: 2rem;
  text-transform: uppercase;
  color: line;
  font-weight: 600;
  font-size: 1.8rem;
  font-family: Arial;
  line-height: 0.833;
  letter-spacing: 10px;
  color: #fff;
  background: -webkit-linear-gradient(45deg, #00a0e9, #10d39d, #00a0e9, #10d39d);
  -moz-linear-gradient(45deg, #00a0e9, #10d39d, #00a0e9, #10d39d);
  -ms-linear-gradient(45deg, #00a0e9, #10d39d, #00a0e9, #10d39d);
 /* 渐变背景 */

  color: transparent;
  /*设置字体颜色透明*/
  -webkit-background-clip: text;
  /*背景裁剪为文本形式*/
  animation: ran 20s linear infinite;
  /*动态20s展示*/
}

做一个动画效果：

@keyframes ran {

  from {

      backgroud-position: 0 0;

  }

  to {

      background-position: 1000px 0;

  }

}

 

效果：