css文字连续光影特效
<style>
body {
background-color: #222;
}
span {
font-size: 50px;
color: #faebd7;
animation: shadowing 2s ease-in-out infinite alternate;
}
@keyframes shadowing {
to {
color: #ff0266;
text-shadow: 20px 0 70px #ff0266;
}
}
span:nth-child(n+2) {
animation-delay: 0.2s;
}
span:nth-child(n+3) {
animation-delay: 0.4s;
}
span:nth-child(n+4) {
animation-delay: 0.6s;
}
span:nth-child(n+5) {
animation-delay: 0.8s;
}
span:nth-child(n+6) {
animation-delay: 1.10s;
}
span:nth-child(n+7) {
animation-delay: 1.2s;
}
span:nth-child(n+8) {
animation-delay: 1.4s;
}
span:nth-child(n+9) {
animation-delay: 1.6s;
}
</style>
<body>
<div>
<div class="html">
<div class="text-area">
<span>C</span>
<span>S</span>
<span>S</span>
<span>T</span>
<span>E</span>
<span>S</span>
<span>T</span>
<span>I</span>
<span>N</span>
<span>G</span>
</div>
</div>
</div>
</body>
689
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
