Html
    Css
    Js

    
                        
 .dv {
	width:600px;
	height:300px;
	margin:0 auto;
	margin-top:100px;
	font-size:80px;
	text-align:center;
	background:-webkit-linear-gradient(left,#147B96,#E6D205 25%,#147B96 50%,#E6D205 75%,#147B96);
	color:transparent;
	-webkit-background-clip:text;
	background-size:200% 100%;
	animation:masked-animation 1s infinite linear;
}
@-webkit-keyframes masked-animation {
	0% {
	background-position:0 0;
}
100% {
	background-position:-100% 0;
}
}

                        
↑上面代码改变,会自动显示代码结果 jQuery调用版本:1.11.3
 立即下载

文字的渐变效果

主要css3的-webkit-background-clip:text;

1
      爱是如此深辰0
      2017/12/5 13:10:18