美文网首页
css3 animation 放大缩小动画

css3 animation 放大缩小动画

作者: ai耳边的呢喃 | 来源:发表于2019-09-27 15:31 被阅读0次
    @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 放大缩小动画

          本文链接:https://www.haomeiwen.com/subject/gccauctx.html