分享一个流光文字的代码css+html

分享一个流光文字的代码

可以给自己的网站装饰一下

演示

源码

html

[lv]

<div class="text-style-1">
    资源网 www.dgw6.xzy
</div>

[/lv]

css

[lv]

@keyframes text-style-1 {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: -100% 0;
  }
}
.text-style-1 {
  font-size: 30px;
  background-image: linear-gradient(to right, red , yellow, green, yellow, red);
  background-clip: text;
  -webkit-background-clip: text;
  background-size: 200% 100%;
  color: transparent;
  animation: text-style-1 2s infinite linear;
}

[/lv]