用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