css3过渡动画transition属性

1、transition-proterty

css样式：参与过渡的css属性名称|all表示所有属性

2、transition-duration

动画执行时间：默认0s，s|ms(毫秒) 1s=1000ms

3、transition-timing-function

1.linear 相同的速度从开始到结束，也就是匀速 2.ease 默认值 慢速度开始--速度变快--慢速度结束 3.ease-in 慢速度开始的过渡效果，也就是以低速度开始 4.ease-out 慢速度结束的过渡效果，也就是以低速结束 5.ease-in-out 以慢速度开始和结束的过渡效果

4、transition-delay

延迟时间：默认0s,单位s|ms

注意：必须设置transition-duration属性，否则执行时间为0，不会产生过渡效果

css3的transform属性

2D变形：平移、旋转、缩放、倾斜

1) transform: translate()平移

transform: translate(x,y) 沿着x轴和y轴移动

transform: translateX(x) 沿着x轴移动

transform: translateY(y) 沿着y轴移动

取值:

px

百分比（强调相对于元素本身计算）

说明：允许负值，正值默认向右向下，负值向左向上

transform: rotate(ndeg) 旋转

transform：rotate(deg);沿着中心点旋转，默认值

transform: rotateX(deg);沿着X轴旋转

transform: rotateY(de