屬性 | 屬性質 | 用途 |
---|---|---|
transform-origin 變形原點 | x-axis | left / center / right / length / % |
y-axis | top / center / bottom / length / % | |
z-axis | left / center / right / length / % | |
transform | none / transform-functions |
控制區塊各種變形 包含2D和3D的旋轉及傾斜 |
translate(x,y) | 移動2D位置 | |
translate3d(x,y,z) | 移動3D位置 | |
translateX(x) | 移動2D x軸位置 | |
translateY(y) | 移動2D y軸位置 | |
translateZ(z) | 移動3D z軸位置 | |
scale(x,y) | 縮放物件比例(100%=1,-50%=0.5) | |
scaleX(x) | 縮放2D x軸位置 | |
scaleY(y) | 縮放2D y軸位置 | |
rotate(angle) | 旋轉(單位deg 角度 °) |
|
rotateX(x-angle) | 旋轉2D x軸位置(單位deg 角度 °) | |
rotateY(y-angle) | 旋轉2D y軸位置(單位deg 角度 °) | |
rotate3d(x,y,z,angle) | 3D旋轉(單位deg 角度 °) x,y,z輸入:1為開啟0為關閉 |
|
skew(x-angle,y-angle) | 傾斜 | |
skewX(angle) | X軸傾斜 | |
skewY(angle) | Y軸傾斜 | |
perspective(n) | number / none | 透視點 |
perspective-origin | x-axis y-axis | 控制3D透視原點 |
transfrom-style | flat / preserve-3d | 指定物件如何在3D空間中呈現 |
backface-visibility | visibility / hidden | 顯示或隱藏背面 |