混合CSS动画迭代

Question

有没有办法在CSS动画中混合迭代？考虑this example。动画到达100%，然后突然重置为0%。我想摆脱那种突然的转变。

Answer 1

只需要使0％关键帧和100％关键帧相同即可。在你的情况下，

0% {
  box-shadow:
    @tqua @tqua, // bottom right
    @double 0, // middle right
    @tqua -@tqua, // top right
    0 -@double, // top middle
    -@tqua -@tqua, // top left
    -@double 0, // middle left
    -@tqua @tqua, // bottom left
    0 @double 0 @resize; // bottom middle
}

demo