《图解CSS3》笔记4 animation动画

浏览数：47 / 时间：2015年06月09日

animation通过调用关键帧keyframe来实现动画，包括8个属性：

1. animation-name　　　　　 关键帧名称

2. animation-duration　　　　时长

3. animation-timing-function 动画函数

4. animation-delay

5. animation-interation-count 频率　　　　　　　　　　　number | "infinite"

6. animation-direction　　　　方向　　　　　　　　　　　normal | altername　　(偶数：顺序播放，奇数：倒序播放)

7. animation-paly-state　　　 播放状态　　　　　　　　　running | pause　　

8. animation-fill-mode　　　　设置时间外属性　　　　　　none(结束时反转到初始) | forward(结束时保留最后帧) | backword | both 

 

关键帧定义：

@keyframes framesName {
    from | 0% {
        ...
    }
    10%, 20%, 30% {
        ...
    }
    to | 100% {
        ...
    }
}

/* Demo */
animation: framesName 1s liear

 

郑重声明：本站内容如果来自互联网及其他传播媒体，其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。

标签： class style log it word for la 时间 io class style log it word for la 时间 io

相关文章

随机文章

您可能还喜欢

您可能还喜欢