利用css3制作网页动画

transform-function

translate 平移

transform: translate(4px,8px);先是x轴再是y轴

transform告诉系统你要形变

只设一个，那么x轴变

scale 缩放

transform: scale(2);

scale()括号中数值表达了缩小或放大的倍数

rotate 旋转

transform: rotate(360deg)

rotate(360deg)

旋转 旋转的角度

skew 倾斜 

transform: skew(40deg,-20deg);

先x轴再y轴

 过渡

transition-property 指定过渡或动态模拟的css属性       常用：all

transition-duration:指定完成过渡所需时间

transition-timing-function 指定过渡函数

ease 逐渐变慢（默认）

linear 均速运动

ease-in 速度越来越快（渐显效果）

ease-out 速度越来越慢（渐隐效果）

ease-in-out 先加速再减速（渐显渐隐效果）

transition-delay 延迟时间 

点击返回目录页