Transform

CSS Transform 函数速查表

函数名描述示例是否支持
translate(x, y)沿 X 和 Y 轴平移元素transform: translate(50px, 20px);
translateX(x)沿 X 轴平移transform: translateX(50px);
translateY(y)沿 Y 轴平移transform: translateY(20px);
scale(x, y)沿 X 和 Y 轴缩放transform: scale(1.5, 2);
scaleX(x)沿 X 轴缩放transform: scaleX(2);
scaleY(y)沿 Y 轴缩放transform: scaleY(0.5);
rotate(angle)旋转元素(单位为 deg 或 rad)transform: rotate(45deg);
skew(x-angle, y)倾斜元素transform: skew(30deg, 20deg);
skewX(angle)沿 X 轴倾斜transform: skewX(30deg);
skewY(angle)沿 Y 轴倾斜transform: skewY(20deg);
matrix(a, b, c, d, e, f)以 2D 矩阵形式定义变换transform: matrix(1, 0, 0, 1, 30, 20);
perspective(n)设置透视距离(3D 变换)transform: perspective(500px);