.rainbow-text {
  /* 多色渐变，定义了完整的彩虹序列 */
  background: linear-gradient(90deg,
      red, orange, yellow, green, blue, indigo, violet,
      red, orange, yellow, green, blue, indigo, violet,
      red, orange, yellow, green, blue, indigo, violet,
      red, orange, yellow, green, blue, indigo, violet,
      red) no-repeat;
  /* 放大背景以便动画时有“空间”可移动 */
  background-size: 400% 100%;
  /* 裁剪到文字本身 */
  -webkit-background-clip: text;
  /* Chrome/Safari */
  background-clip: text;
  /* 标准 */
  -webkit-text-fill-color: transparent;
  /* 隐藏原文字色 */
  /* 单向平移动画 */
  animation: rainbow-slide 4s linear infinite;
}

@keyframes rainbow-slide {

  /* 从背景最左侧移动到最右侧 */
  from {
    background-position: 100% 0;
  }

  /* 默认位置 */
  to {
    background-position: 0% 0;
  }

  /* 平移至尽头 */
}