html
<div class="rotate_bg">
<img class="rotateImages" src="images/01.png" />
</div>
css
.rotate_bg{
width: 500px;
height: 500px;
background: #59d1b6;
margin: 200px auto;
}
.rotate_bg img.rotateImages{
-webkit-animation:myRotate 10s linear infinite;
animation:myRotate 10s linear infinite;
}
@-webkit-keyframes myRotate{
0%{ -webkit-transform: rotate(0deg);}
50%{ -webkit-transform: rotate(180deg);}
100%{ -webkit-transform: rotate(360deg);}
}
@keyframes myRotate{
0%{ -webkit-transform: rotate(0deg);}
50%{ -webkit-transform: rotate(180deg);}
100%{ -webkit-transform: rotate(360deg);}
}
效果图
