首页 > Web开发 > 详细

css 图片循环放大缩小

时间:2021-08-24 16:45:33      阅读:8      评论:0      收藏:0      [点我收藏+]
<image class="anima" mode="widthFix" scr="/pic.png">

.anima{

  animation-name:likes;//动画名称

  animation-direction:alternate;//动画 奇数放大,偶数缩小

  animation-timing-function:linear;//动画执行方式

  animation-delay:0s;//延迟时间

  animation-duration:1s;//动画完成时间

}

@keyframes likes{

  0%{

    transform :scael(1);
  }

  25%{

    transform :scael(0.9);
  }

  50%{

    transform :scael(0.85);
  }

  75%{

    transform :scael(0.9);
  }

  100%{

    transform :scael(1);
  }

}

 

css 图片循环放大缩小

原文:https://www.cnblogs.com/chenshaoxiong/p/15180555.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!