html转动的圆圈,html – 用css悬停旋转圆圈[复制]

如果你需要“旋转-15deg然后到15deg并最终停在0deg”

你必须改变

h6:hover {transform:rotate(-90deg);}

至

h6:hover {

-moz-animation-name: rotate 1s linear 1;

-webkit-animation-name: rotate 1s linear 1;

animation-name: rotate 1s linear 1;

}

@-moz-keyframes rotate {

0%, 100% {-moz-transform: rotate(0deg);}

33% {-moz-transform: rotate(15deg);}

66% {-moz-transform: rotate(-15deg);}

}

@-webkit-keyframes rotate {

0%, 100% {-webkit-transform: rotate(0deg);}

33% {-webkit-transform: rotate(15deg);}

66% {-webkit-transform: rotate(-15deg);}

}

@keyframes rotate {

0%, 100% {transform: rotate(0deg);}

33% {transform: rotate(15deg);}

66% {transform: rotate(-15deg);}

}