animate

animation: myfirst 5s linear 2s infinite alternate;

-webkit-animation: myfirst 5s linear 2s infinite alternate; /* Safari 与 Chrome: */

animation-name | 规定 @keyframes 动画的名称。
animation-duration | 规定动画完成一个周期所花费的秒或毫秒。默认是 0。
animation-timing-function | 规定动画的速度曲线。默认是 "ease"。
animation-delay | 规定动画何时开始。默认是 0。
animation-iteration-count | 规定动画被播放的次数。默认是 1。 infinite无限次
animation-direction | 规定动画是否在下一周期逆向地播放。默认是 "normal"。
animation-play-state | 规定动画是否正在运行或暂停。默认是 "running"。 paused

animation-timing-function:
| linear | 动画从头到尾的速度是相同的。
| ease | 默认。动画以低速开始,然后加快,在结束前变慢。
| ease-in | 动画以低速开始。
| ease-out | 动画以低速结束。
| ease-in-out | 动画以低速开始和结束。

animation-direction
| normal | 默认值。动画按正常播放。
| reverse | 动画反向播放。
| alternate | 动画在奇数次(1、3、5...)正向播放,在偶数次(2、4、6...)反向播放。
| alternate-reverse | 动画在奇数次(1、3、5...)反向播放,在偶数次(2、4、6...)正向播放。 |

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容