animation以及transition的综合运用

Css动画：animation：

name:定义动画的名称，和后面的@keyframes一起使用(关键帧)，而关键帧里面可以设置from,to,百分比等等。

而且一般在外层设置动画的相关属性，如name,duration,iteration-count,timing-function,alternate-reverse.在外层设置相对定位，里层设置绝对定位。

一般来说会设置三层div来显示3D效果，最外层加上-webkit-perspective: 1000px;第二层-webkit-transform-style: preserve-3d;

第三层 放置各个子层；

transition和animation的区别

transition是过渡，animation是动画。而且过渡的效果只能是有限的，动画是可以无限循环的，animation可以设置3D效果，而且animation是要设置关键帧的。

转载于:https://www.cnblogs.com/programerHuan/p/4772641.html