| translate |
translate() |
transform: translate(10px, 20px) |
X좌표, Y좌표 이동을 나타냅니다. |
| translate3d() |
transform: translate3d(10px, 20px, 30px) |
X좌표, Y좌표, Z좌표 이동을 나타냅니다. |
| translateX() |
transform: translateX(10px) |
X좌표 이동을 나타냅니다. |
| translateY() |
transform: translateY(10px) |
Y좌표 이동을 나타냅니다. |
| translateZ() |
transform: translateZ(10px) |
Z좌표 이동을 나타냅니다. |
| scale |
scale() |
transform: scale(2, 2) |
선택한 요소의 X축과 Y축 확대를 설정합니다. |
| scale3d() |
transform: scale3d(2, 2, 2) |
선택한 요소의 X축, Y축, Z축 확대를 설정합니다. |
| scaleX() |
transform: scaleX(2) |
선택한 요소의 X축 확대를 설정합니다. |
| scaleY() |
transform: scaleY(2) |
선택한 요소의 Y축 확대를 설정합니다. |
| scaleZ() |
transform: scaleZ(2) |
선택한 요소의 Z축 확대를 설정합니다. |
| skew |
skew() |
transform: skew(10deg, 20deg) |
선택한 요소의 X축, Y축 회전을 설정합니다. |
| skew3d() |
transform: skew3d(10deg, 20deg, 30deg) |
선택한 요소의 X축, Y축, Z축 회전을 설정합니다. |
| skewX() |
transform: skewX(10deg) |
선택한 요소의 X축 회전을 설정합니다. |
| skewY() |
transform: skewY(10deg) |
선택한 요소의 Y축 회전을 설정합니다. |
| skewZ() |
transform: skewZ(10deg) |
선택한 요소의 Z축 회전을 설정합니다. |
| skew |
skew() |
transform: skew(10deg, 20deg) |
선택한 요소의 X축, Y축 기울기를 설정합니다. |
| skewX() |
transform: skewX(10deg) |
선택한 요소의 X축 기울기를 설정합니다. |
| skewY() |
transform: skewY(10deg) |
선택한 요소의 Y축 기울기를 설정합니다. |
| etc |
transform-origin |
transform-origin: 20%, 30% |
선택한 요소의 X축, Y축 기준점을 설정합니다. |
| transform-style |
transform-style: preserve-3d |
선택한 요소 스타일을 3D로 설정합니다. |
| perspective |
perspective: 500px |
선택한 요소의 원근점 거리를 설정합니다. |
| perspective-origin |
perspective-origin: 500px |
선택한 요소의 원근점 뱡향을 설정합니다. |
| backface-visibility |
backface-visibility: hidden; |
선택한 요소의 3D 뒷면의 배경 유무를 설정합니다. |