CSS控制SVG圆形放大缩小动画实例页面

展示

代码

• HTML：

  <svg>
      <circle class="circle"<svg>
      <circle cx="150" cy="75" r="60" fill="deepskyblue"></circle>
  </svg>

• CSS：

  svg {
      outline: 1px dotted;
  }
  circle {
      animation: zoomInOut 1s infinite alternate;
  }
  @keyframes zoomInOut {
      from { r: 60px; }
      to { r: 75px; }
  }