码迷,mamicode.com
首页 > Web开发 > 详细

CSS图片旋转-实现加载中动画效果

时间:2021-04-14 12:20:55      阅读:0      评论:0      收藏:0      [点我收藏+]

标签:infinite   nim   style   ota   alt   rds   height   nsf   png   

一、代码展示

  <template>

    ...

    <div class="loading-animation-box" >
      <img class="loading-animation" width="26" height="28" src="../../../static/images/balabla.png" />
    </div>
             ...
      </templeate>
 
  <style>
    .loading-animation-box{
      margin: 0;
      padding: 0;
      .loading-animation{
        animation:loading 0.75s linear infinite forwards;
     }
    @keyframes loading{
      0%{
        transform:rotate(0deg)
      }
        100%{
          transform:rotate(360deg)
        }
      }
    }
      </style>
二、效果展示
技术图片
 

CSS图片旋转-实现加载中动画效果

标签:infinite   nim   style   ota   alt   rds   height   nsf   png   

原文地址:https://www.cnblogs.com/jiangup/p/14655852.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!