<div class="rotate">
</div>
<div class="rotate c1">
</div>
.rotate{  
  width:200px;
  height:200px;
  border-radius:50%;
  margin:5em;
  float:left;
  background:linear-gradient(to right, #00dbde 0%, #fc00ff 100%);
  animation:shun 5s linear infinite; /*顺时针无限旋转*/
 
}
.c1{
  transform-origin:right center; /*改变旋转的中心点*/
}
@keyframes shun{
	0%{
		transform:rotate(0deg);}
	100%{
		transform:rotate(360deg);}
	}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.