@keyframes likes {
0% {
width: 140px;
height: 140px;
}
100% {
width: 160px;
height: 160px;
}
}
.anima {
animation-name: likes; // 动画名称
animation-direction: alternate; // 动画在奇数次(1、3、5...)正向播放,在偶数次(2、4、6...)反向播放。
animation-timing-function: linear; // 动画执行方式,linear:匀速;ease:先慢再快后慢;ease-in:由慢速开始;ease-out:由慢速结束;ease-in-out:由慢速开始和结束;
animation-delay: 0s; // 动画延迟时间
animation-iteration-count: infinite; // 动画播放次数,infinite:一直播放
animation-duration: 0.8s; // 动画完成时间
}
css3 animation 放大缩小动画
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。
推荐阅读更多精彩内容
- ***介绍的属性并不完全,写的都是我认为容易混淆的难点属性,所以属性会在最后综合案例展示~ Keyframes介绍...
- 介绍的属性并不完全,写的都是我认为容易混淆的难点属性,所以属性会在最后综合案例展示 一.Keyframes介绍: ...
- css3 animation动画 @keyframes 定义关键帧动画 animation-name 动画名称 a...
- 1、transition-property 设置过渡的属性,比如:width height background-...
- 当我们给元素添加Animation后,动画总是现在元素的初始位置显示一下,然后再跳到动画的起始位置播放,这样的话会...