一个摇摆的吊坠

最新推荐文章于 2021-09-05 09:37:41 发布

忘。。。忘了要干嘛了

最新推荐文章于 2021-09-05 09:37:41 发布

阅读量123

点赞数

本文链接：https://blog.csdn.net/weixin_44549449/article/details/87870602

版权

<style>
  *{
   margin: 0;
   padding: 0;
  }
  .sio{
   width: 100%;
   height: 990px;
   background: #FFF;
  }
  .ahu img{
   width: 150px;
   height: 500px;
   position: absolute;
   top:0px;
   left: 600px;
   transform: rotate(50deg);
   animation: move 20s 0s infinite;
   animation-fill-mode: backwards;
  }
.dkam {
    width: 65px;
    height: 65px;
    position: relative;
    top: 190px;
    left: 640px;
    border-radius: 150px;
    background: #FF0004;
    box-shadow: 0px 0px 0px 5px #000;
}
  @keyframes move{
   0%{transform: rotate(50deg);}
   5%{transform: rotate(-50deg);}
   10%{transform: rotate(50deg);}
   15%{transform: rotate(-50deg);}
   20%{transform: rotate(50deg);}
   25%{transform: rotate(-50deg);}
   30%{transform: rotate(50deg);}
   35%{transform: rotate(-50deg);}
   40%{transform: rotate(50deg); }
   45%{transform: rotate(-50deg); }
   50%{transform: rotate(50deg); }
   55%{transform: rotate(-50deg);}
   60%{transform: rotate(50deg); }
   65%{transform: rotate(-50deg); }
   70%{transform: rotate(50deg); }
   75%{transform: rotate(-50deg); }
   80%{transform: rotate(50deg); }
   85%{transform: rotate(-50deg); }
   90%{transform: rotate(50deg); }
   95%{transform: rotate(-50deg); }
  100%{transform: rotate(50deg);}
  }
 </style>
 <body>
 <div class="sio">
  
  <div class="ahu">
   <img src="img/n'c捕获.PNG" alt="">
  </div>
  <div class="dkam"></div>
 </div>
</body>