質問: webkit css endless rotation-animationの実行方法。 読み込みアイコンをcssで回転させたい。アイコンと次のコードがあります:<style> #test { width: 32px; height: 32px; background: url('refresh.png'); } .rotating { -webkit-transform: rotate(360deg); -webkit-transition-duration: 1s; -webkit-transition-delay: now; -webkit-animation-timing-function: linear; -webkit-animation-iteration-count: infinite; } </style> <div id='test' class='rotating'></div> しかし、それは機能しません。 cssを使用してアイコンを回転するにはどうすればよいですか?
回答: <style> div { height:200px; width:200px; -webkit-animation: spin 2s infinite linear; } @-webkit-keyframes spin { 0% {-webkit-transform: rotate(0deg);} 100% {-webkit-transform: rotate(360deg);} } </style> </head> <body> <div><img src="1.png" height="200px" width="200px"/></div> </body>