SOURCE

console 命令行工具 X clear

                    
>
console
<svg width="500" height="500" >
    <circle cx="200" cy="200" r="20" fill="none" stroke="black" class="y1"/>
    <circle cx="200" cy="200" r="50" fill="none" stroke="black" class="y2"/>
    <circle cx="200" cy="200" r="80" fill="none" stroke="black" class="y3"/>
</svg>
@keyframes bian1{
    0%{
        r:20;
        stroke: white;
    }
    100%{
        r:50;
        stroke: black;
    }
}
@keyframes bian2{
    0%{
        r:50;
        stroke: white;
    }
    100%{
        r:80;
        stroke: black;
    }
}
@keyframes bian3{
    0%{
        r:80;
        stroke: white;
    }
    100%{
        r:110;
        stroke: black;
    }
}
.y1{
    animation: bian1 2s infinite;
}
.y2{
    animation: bian2 2s infinite;
}
.y3{
    animation: bian3 2s infinite;
}