代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
text {
font-size: 50px;
stroke: red;
stroke-width: 2;
stroke-dasharray: 0;
}
.text1 {
stroke: yellow;
animation: text1 10s infinite;
}
.text2 {
stroke: blue;
animation: text2 10s infinite;
}
.text3 {
stroke: #CD7F32 ;
animation: text3 10s infinite;
}
@keyframes text1 {
0%,100% {
stroke-dasharray: 20;
}
50% {
stroke-dasharray: 250;
}
}
@keyframes text2 {
0%,100% {
stroke-dasharray: 233;
}
50% {
stroke-dasharray: 20;
}
}
@keyframes text3 {
0%,100% {
stroke-dasharray: 188;
}
50% {
stroke-dasharray: 10;
}
}
</style>
</head>
<body>
<svg width="400" height="150">
<g>
<text x="160" y="75">我爱撸码</text>
<text class="text1" x="160" y="75">我爱撸码</text>
<text class="text2" x="160" y="75">我爱撸码</text>
<text class="text3" x="160" y="75">我爱撸码</text>
</g>
</svg>
</body>
</html>
效果：
