为什么此CSS3动画在MSEdge或IE11中不起作用？

尽管MSDN表示，从MS Edge开始，stroke-dashoffset属性可以通过CSS动画和过渡设置动画，但是由于某些原因，它仍然不起作用。如果我们使用stroke-dasharray而不是来重新创建此动画，stroke-dashoffset则它将在Edge中按预期工作。

但是它仍然不能在IE11或更低版本中使用，因为再次如MSDN所示，stroke-dasharray可以使用CSS动画和仅从MS Edge过渡的动画。

修改后的动画仍然可以在最新版本的Chrome，Firefox和Opera中使用。

#my-circle {
  stroke: blue;
  stroke-dasharray: 1100;
  stroke-dashoffset: 0;
  animation: draw-first-shape 1s forwards 3;
}
@keyframes draw-first-shape {
  from {
    stroke-dasharray: 0, 1100;
  }
  to {
    stroke-dasharray: 1100, 1100;
  }
}