css 实现旋转-风车

css

1. 放置风车图片

<img src="http://sylblog.xin/usr/uploads/2018/04/119099866.gif" alt="小风车">

2. css

@keyframes rotating {
       from{
           transform: rotate(0);
       }
       to{
           transform: rotate(360deg);
       }
 }
 img{
       animation: rotating 1.2s linear infinite
 }

linear：匀速
infinite表示无限次循环动画

效果 （录制jif，原效果平滑）

本文由 coder-syl 创作，采用 知识共享署名4.0 国际许可协议进行许可
本站文章除注明转载/出处外，均为本站原创或翻译，转载前请务必署名
最后编辑时间为: Apr 18, 2019 at 10:50 pm