<p>这里是展示的文字这里是展示的文字这里是展示的文字</p>
p {
    font-size: 20px;
    /*设置渐变背景,最好设置为能无缝拼接的渐变*/
    background-image: -webkit-linear-gradient(left, blue, red 25%, blue 50%, red 75%, blue 100%);
    /*文字填充色为透明*/
    -webkit-text-fill-color: transparent;
    /*背景剪裁为文字,相当于用背景填充文字*/
    -webkit-background-clip: text;
    /*将背景拉长一倍,给予移动变化空间,用作流光效果*/
    -webkit-background-size: 200% 100%;
    -webkit-animation: light 4s infinite linear;
}
@-webkit-keyframes light {
    0%  {
        background-position: 0 0;
    }
    100% {
        background-position: -100% 0;
    }
}
Rerun