css3动画

@keyframes 和 animation

@keyframes animationname {
    keyframes-selector {'css-styles'}
}

完成时间	速度曲线	延迟	播放次数	是否逆向	是否运动	完成后状态
秒（s）	linear	秒（s）	.left, .right{ float: left; width: 150px; height: 300px; background: red;}.right{ float: right;}.main{ height:300px; background: green; overflow:hidden; /* bfc */}css	normal	running	none
毫秒（ms）	ease	毫秒（ms）	infinite 无限次	reverse	paused	forwards 保持最后一帧
	ease-in
	ease-out
	ease-in-out

位移	缩放	旋转	倾斜
translate(x,y)	scale(x,y)	rotate(angle)	skew(x-angle,y-angle)

css属性名称	完成时间	速度曲线	延迟
none	秒（s）	linear	秒（s）
all	毫秒（ms）	ease	毫秒（ms）
property：用逗号隔开		ease-in
		ease-out
		ease-in-out