css3动画

1. 2d动画
    transform属性包括：
    平移transform:translate(x,y,z)默认x轴平移，transform:translatey(ypx)表示沿y轴平移y像素。
    旋转transform:rotate(x,y,z)默认z轴旋转，transform-origin属性定义旋转中心，transform:rotatex(90deg)表示绕x轴旋转90度。
    变形transform:skew(deg)。
    伸缩tranasform:scale(width,height），transform:scale(0.5,1.5)表示宽变为原来的0.5倍，高变为原来的1.5倍。
    复合属性transform:  translate(xpx)   rotate(90deg)    skew(30deg)  scale(0.5 1.5);
2.过渡动画
	transition属性（过渡的是元素的属性值）包括：
	transition-delay:1s;表示动画延迟一秒开始播放。
	transition-duration:1s;表示动画一秒执行结束。
	transition-timing-function动画的执行方式:linear匀速 ease-in慢开 ease-in-out慢开慢关。
	transition-property：过渡什么属性，过渡多个用逗号分开，过渡所有用all。
	复合属性transition:1s 1s linear all;（延迟时间写在执行时间之前）
3.帧动画
	animation属性
	animation是所有动画属性的简写属性，除了 animation-play-state 属性。	
	animation-name规定@keyframes动画的名称。
    animation-dulation规定动画完成一个周期所花时间。
    animation-timing-function规定动画的速度曲线 ，默认ease。
    animation-delay规定动画何时开始 默认0。
    animation-iteration-count规定动画播放次数 默认1 ，infinite无限次。
    animation-direction: alternate;播放方式：奇偶播放。
    animation-play-state规定动画是否正在运行或暂停 ，默认running， paused暂停。
    animation-fill-mode: forwards;动画停止到完成位置。
4.3d动画
	@keyframes属性 ，规定动画。@keyframes tq_rotate{
												    from{}
													to{}
											      }
	复合属性animation: tq_rotate 3s 1s  ease infinite;(旋转的延迟时间写在执行时间之后)
5.2d转3d
	transform-style: preserve-3d;