CSS3 animation-direction 属性

animation-direction 属性指定动画播放时是否反向播放或交替播放。

语法

-------------------- ------ - ------- - --------- - ------------------

• normal: 默认值，动画正常播放。
• reverse: 动画反向播放。
• alternate: 动画交替播放，正向播放后反向播放，循环往复。
• alternate-reverse: 动画反向交替播放，反向播放后正向播放，循环往复。

示例

-- ---- --
--------- -
  -------------------- -------
-

-- ---- --
--------- -
  -------------------- --------
-

-- ---- --
--------- -
  -------------------- ----------
-

-- ------ --
--------- -
  -------------------- ------------------
-

注意事项

• animation-direction 只影响动画播放的方向，不会改变动画的时间轴或速度。
• 结合 animation-iteration-count 属性可以控制动画的播放次数和方向。