<html> <head> <meta charset="UTF-8"> <script src="http://apps.bdimg.com/libs/jquery/1.7.2/jquery.min.js"></script> <style> #xuanzhun{ -webkit-transition-property: -webkit-transform; -webkit-transition-duration: 1s; -moz-transition-property: -moz-transform; -moz-transition-duration: 1s; -webkit-animation: rotate 3s linear infinite; -moz-animation: rotate 3s linear infinite; -o-animation: rotate 3s linear infinite; animation: rotate 3s linear infinite; } @-webkit-keyframes rotate{from{-webkit-transform: rotate(0deg)} to{-webkit-transform: rotate(360deg)} } @-moz-keyframes rotate{from{-moz-transform: rotate(0deg)} to{-moz-transform: rotate(359deg)} } @-o-keyframes rotate{from{-o-transform: rotate(0deg)} to{-o-transform: rotate(359deg)} } @keyframes rotate{from{transform: rotate(0deg)} to{transform: rotate(359deg)} } </style> </head> <body> <div id="xuanzhun" style="width: 30px; height: 30px; background-color: aquamarine;"> </div> </body> </html>