手把手教你,从零开始创建一个svg描边动画图片

1.先在html中创建svg元素

2.在svg里面添加矩形元素rect

  

3.添加css描边动画

  // stroke-dasharray:第一个数值是实线长度,第二个数值是间隙长度
  // stroke-dashoffset:是描边线的偏移量(正值:左上角逆时针偏移量;负值:左上角顺时针偏移量)
  // stroke-width:描线宽度
  // fill:矩形填充色
  // stroke:描线颜色
      
    

7.动画效果

Image 1.png

你可能感兴趣的:(svg,svg动画)