流光渐变文字动画源代码css

演示

html

[lv]

<div class="text-style-1">
QQ资源吧 m.qqzy8.com
</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]