渐变加动画文字

.ms-title {

        width: 200px;

        line-height: 50px;

        text-align: center;

        font-size: 20px;

        color: #fff;

        margin:0 auto;

        background-image: -webkit-linear-gradient(left,red,orange,yellow,green,pink,indigo,violet);

        -webkit-text-fill-color: transparent;

        -webkit-background-clip: text;

        -webkit-background-size: 200% 100%;

        -webkit-animation: masked-animation 2s infinite linear;

    }

   @-webkit-keyframes masked-animation {

        0% {

            background-position: 0 0;

        }

        100% {

            background-position: -100% 0;

        }

    }