animation和transform通常要一起使用
首先要定义一个name即
@keyframe myname{
from(transform:rotate() translate())
to(transform:rotate() translate())
}里面为其初始状态以及结束状态,若想要更好的效果则将里面的过程细分为百分比,从0到100%,分的越多。帧数越多则效果越好
同样的animation也需要在其作用的元素上加一个animation属性
例如img{
animation:myname(@keyframe定义的名字) 800ms(动画效果持续时间) ease(动画播放速度的控制) delay(延迟时间) infinite(无限次循环,默认为1回) reverse(反向循环)/alternate(摇摆循环)/alternate-reverse(反向摇摆) pause(暂停)
}
css3之动画效果animation
最新推荐文章于 2022-06-07 14:00:30 发布