知识点一：旋转

新加的属性：transform： rotateZ(ndeg);

知识点二：过度动画

transform-style：preserve-3d;// 设置成3D的效果，，必加的东西
perspective: 800px-2000px;  //设置成右侧边阴影的。。。。。

@keyframes name {

0% {

transform: rotate(180deg);

}

180% {

transform: rotate(360deg);

}

360% {

trnsform: rotate(720deg);

}

}//结束到这  。。。结束

animation: name 20s;  //过渡加在动画的元素上
或者是这种。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。
animation-name: name;
animation-duration:  3s;//动画指定需要多少秒或毫秒完成
animation-timing-function: 设置动画将如何完成一个周期
animation-delay: 时间； //设置动画在启动前的延迟间隔。