如何用HTML5实现图片转圈的动画效果

如何用HTML5实现图片转圈的动画效果

我们大家都知道让画面动起来就会让画面显得更加的生动好看，今天小编就给大家分享一下如何用HTML5实现图片转圈的动画效果，对该问题感兴趣或者是对HTML开发感兴趣的小伙伴就随小编一起来了解一下吧。

具体代码如下：

@mixin ani-btnRotate{

@keyframes btnRotate{

from{transform: rotateZ(0);}

to{transform: rotateZ(360deg);}

}

}

@include ani-btnRotate;

#circle{

position: absolute;

left: 50%;

width: REM(338);

height: REM(338);

margin-top: REM(200);

margin-left: REM(-338/2);

transform-origin: center center ;

animation: btnRotate 1s 1s linear forwards;

}

以上就是小编给大家分享的如何用HTML5实现图片转圈的动画效果，希望对小伙伴们有帮助，想要了解更多关于HTML开发方面问题的小伙伴可以登录扣丁学堂官网咨询。