转载：CSS 一种颜色变化的文字_哔哩哔哩_bilibili
https://www.bilibili.com/video/BV1RT4y1Z7Kg/

p {
    font-size: 30px;
    text-align: center;
    margin-top: 20%;
    background-image: -webkit-linear-gradient(left, #e9a5a5, #b8c1c0 10%, #65c0e0 20%, #aea2db 30%, #81c1d9 40%, #e9a5a5 50%, #b8c1c0 60%, #65c0e0 70%, #aea2db 80%, #81c1d9 90%, #e9a5a5);
    color: transparent;

    /* 将背景裁剪为文字 */
    -webkit-background-clip: text;

    /* 背景放大一倍，动画才有移动的空间 */
    background-size: 50% 100%;

    /* 动画 规定四秒执行完 无限循环 匀速播放 */
    animation: a 5s infinite linear;
}

@keyframes a {
    0% {
        background-position: 0 0;
    }

    100% {
        background-position: -100% 0;
    }
}