使用css3 属性方法 rotate() 实现旋转
.icon {
-webkit-animation: animal 1s infinite linear ;
-webkit-transform-origin: center center;
-ms-transform-origin: center center;
transform-origin: center center;
}
@-webkit-keyframes animal {
0%{
transform: rotate(0deg);
-ms-transform: rotate(0deg);
-webkit-transform: rotate(0deg);
}
100%{
transform: rotate(-360deg);
-ms-transform: rotate(-360deg);
-webkit-transform: rotate(-360deg);
}
}
transform-origin是规定如何旋转
: center center;为以围绕中心点旋转;
top left; 以围绕左上角旋转;
top right; 以围绕右上角旋转;