用CSS不斷旋轉div - 只需css

Question

可以用CSS不斷旋轉div嗎？我該怎麼做？

例如：

div { 
    width:100px; 
    height:100px; 
    border: 1px solid red; 
} 

Answer 1

使用CSS3 @keyframes規則

//html 
<div class="rotating"></div> 



//css 

div { 
width:100px; 
height:100px; 
border: 1px solid red; 
} 

@-webkit-keyframes rotating { 
    from{ 
    -webkit-transform: rotate(0deg); 
    } 
    to{ 
    -webkit-transform: rotate(360deg); 
    } 
} 

.rotating { 
    -webkit-animation: rotating 2s linear infinite; 
} 

這裏是例子 http://codepen.io/anon/pen/GopMeq