css鼠标经过旋转一圈

内容详情
评论详情

2020-03-06 19:32 作者:达人设计浏览(41651) 评论(0) 喜欢(0)

@keyframes rotation{
  from {-webkit-transform: rotate(0deg);}
  to {-webkit-transform: rotate(360deg);}
}
@-ms-keyframes rotation{
  0%{
  transform: rotate(0);
  }
  50%{
  transform:rotate(180deg);
  }
  100%{
  transform: rotate(360deg);
  }
}
@-webkit-keyframes rotation{
  from {-webkit-transform: rotate(0deg);}
  to {-webkit-transform: rotate(360deg);}
}
@-moz-keyframes rotation{
  from {-webkit-transform: rotate(0deg);}
  to {-webkit-transform: rotate(360deg);}
}
@-o-keyframes rotation{
  from {-webkit-transform: rotate(0deg);}
  to {-webkit-transform: rotate(360deg);}
}
.Rotation {
  cursor:pointer;
}
.Rotation:hover{
  animation: rotation 1s 1;
  -ms-animation: rotation 1s 1;
  -moz-animation:rotation 1s 1;
  -webkit-animation:rotation 1s 1;
  -o-animation: rotation 1s 1;
}