transform: none|transform-functions;
值 | 描述 |
---|---|
none | 不进行转换 |
matrix(n,n,n,n,n,n) | 2D 转换,使用六个值的矩阵 |
matrix3d(n,n,n,n,n,n,n,n,n,n,n,n,n,n,n,n) | 3D 转换,使用 16 个值的 4x4 矩阵 |
translate(x,y) | 2D 转换 |
translate3d(x,y,z) | 3D 转换 |
translateX(x) | 转换,只是用 X 轴的值 |
translateY(y) | 转换,只是用 Y 轴的值 |
translateZ(z) | 3D 转换,只是用 Z 轴的值 |
scale(x,y) | 2D 缩放转换 |
scale3d(x,y,z) | 3D 缩放转换 |
scaleX(x) | 通过设置 X 轴的值来定义缩放转换 |
scaleY(y) | 通过设置 Y 轴的值来定义缩放转换 |
scaleZ(z) | 通过设置 Z 轴的值来定义 3D 缩放转换 |
rotate(angle) | 2D 旋转,在参数中规定角度 |
rotate3d(x,y,z,angle) | 3D 旋转 |
rotateX(angle) | X 轴的 3D 旋转 |
rotateY(angle) | Y 轴的 3D 旋转 |
rotateZ(angle) | Z 轴的 3D 旋转 |
perspective(n) | 为 3D 转换元素定义透视视图 |
值 | 描述 |
---|---|
animation | 简写 |
animation-name | 规定需要绑定到选择器的 keyframe 名称。 |
animation-duration | 规定完成动画所花费的时间,以秒或毫秒计。 |
animation-timing-function | 规定动画的速度曲线。 |
animation-delay | 规定在动画开始之前的延迟。 |
animation-iteration-count | 规定动画应该播放的次数。 |
animation-direction | 规定是否应该轮流反向播放动画。 |
animation-timing-function 使用名为三次贝塞尔(Cubic Bezier)函数的数学函数,来生成速度曲线。您能够在该函数中使用自己的值,也可以预定义的值:
值 | 描述 |
---|---|
linear | 动画从头到尾的速度是相同的。 |
ease | 默认。动画以低速开始,然后加快,在结束前变慢。 |
ease-in | 动画以低速开始。 |
ease-out | 动画以低速结束。 |
ease-in-out | 动画以低速开始和结束。 |
cubic-bezier(n,n,n,n) | 在 cubic-bezier 函数中自己的值。可能的值是从 0 到 1 的数值。 |