CSS3动态渐变文字效果
效果图如下:
<style>
h1 {
background-image: radial-gradient(#ED4264, #FFEDBC);
width: 700px;
height: 200px;
font-size: 50px;
-webkit-background-clip: text;
color: transparent;
animation: ani 3s infinite ease-in-out;
background-position: 200px 200px;
}
@keyframes ani {
0% {
background-position: 250px 200px;
}
100% {
background-position: 450px 400px;
}
}
</style>
</head>
<body>
<div>
<h1>路漫漫其修远兮吾将上下而求索</h1>
</div>
</body>