最近在整理css3相关的学习资料，发现css3的动画效果很棒，自己也写了一个，下面是具体代码：
css:
.box{
width:100px;
height:100px;
background:#F00;
color:#FFF;
text-align:center;
position:absolute;
left:675px;
top:150px;
/* 定义动画的过程 */
-webkit-transition:-webkit-transform .5s ease-in,background-color .5s ease-in;/* webkit */
-moz-transition:-moz-transform .5s ease-in,background-color .5s ease-in;/* Gecko */
-o-transition:-o-transform .5s ease-in,background-color .5s ease-in;/* opera */
transition:transform .5s ease-in,background-color .5s ease-in;/* 向后兼容 */
}
.box:hover{
/* 定义动画的状态 */
-webkit-transform:rotate(360deg) scale(2,2);/* webkit */
-moz-transform:rotate(360deg) scale(2,2);/* Gecko */
-o-transform:rotate(360deg) scale(2,2);/* opera */
transform:rotate(360deg) scale(2,2);/* 向后兼容 */
background:#009;
}
html:
<div class="box">box transform </div>
提示：你可以先修改部分代码再运行。