标签：frame ati ima cti color func dir 加速 元素
animation-name:指定由@keyframes描述的关键帧；
animation-duration:设置动画完成一个周期的时长；
animation-duration:3s;//3秒完成一个动画
animation-timing-function:设置动画速度；
animation-timing-function:ease;//先加速后减速
animation-timing-function:linear//匀速
animation-timing-function:ease-in;//加速
animation-timing-function:ease-out;//先加速后减速
animation-timing-function:ease-in-out;//先减速再加速再减速
//所有的速度曲线都不一样
animation-direction:设置动画是否反向播放；注意animation-direction:reverse反转的是关键帧和animation-timing-function
animation-direction:normal;//运动过程从form到to
animation-direction:reverse;//运动过程从to到from
animation-direction: alternate;//开始时图像在from位置，运动过程从from到to再到from，直到完成动画，最后一次完成时会立马跳回原位置
animation-direction:alternate-reverse;//开始时图像立马到to的位置，运动过程从to到from再到to，直到完成动画，最后一次完成时会立马跳回原位置
animation-direction:normal,reverse;//运动过程从from到to，然后立马返回起始位置
animation-delay:设置动画延迟；
animation-delay:3s;//动画延迟3秒后开始
animation-iteration-count:设置动画运行次数，运行期间不受animation-delay影响；
animation-iteartion-count:3;//重复3次动画
animation-fill-model:设置元素在动画外的动画；
animation-fill-model:none;//默认情况下，CSS 动画在第一个关键帧播放完之前不会影响元素，在最后一个关键帧完成后停止影响元素。animation-fill-mode 属性可重写该行为
animation-fill-mode:forwards;//在动画完成后停留在最后一帧
animation-fill-mode:backward;//在动画完成后回到起始位置
animation-fill-mode:both;//动画遵循 forwards 和 backwards 的规则。也就是说，动画会在两个方向上扩展动画属性
标签：frame ati ima cti color func dir 加速 元素
原文地址：https://www.cnblogs.com/xiej/p/10041408.html
