Css 無線轉圈圈 loading
Posted on May 9th, 2014
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<html> | |
<head> | |
<style> | |
body { | |
background-color: #444; | |
} | |
@-webkit-keyframes rotating { | |
from{ | |
-webkit-transform: rotate(0deg); | |
} | |
to{ | |
-webkit-transform: rotate(360deg); | |
} | |
} | |
.rotating { | |
-webkit-animation: rotating 1s linear infinite; | |
} | |
.circle { | |
color: #444; | |
height: 32px; width: 32px; | |
display: inline-block; | |
background-color: #e8e; | |
border-radius: 50%; | |
} | |
</style> | |
</head> | |
<body> | |
<div class='rotating circle'>__</div> | |
</body> | |
</html> |
DEMO: [JSFIDDLE](http://jsfiddle.net/aRgTP/)