perspective-origin
3D 변환의 소실점(vanishing point) 위치를 설정합니다. poc가 기본값이며, 소실점을 이동하면 3D 효과의 시점이 변합니다.
클래스 목록
| <tr> <th class="tal py12px px16px bg18181B bb2pxsolid27272A cA1A1AA fw600 ttu fs12px ls0-05em">클래스 | CSS | 설명 |
|---|---|---|
poc | perspective-origin: center | 중앙 소실점 (기본값) |
pot | perspective-origin: top | 상단 소실점 |
pob | perspective-origin: bottom | 하단 소실점 |
pol | perspective-origin: left | 좌측 소실점 |
por | perspective-origin: right | 우측 소실점 |
사용 예시
perspective-origin은 perspective 속성이 설정된 부모 요소에 적용합니다.
<!-- Default center viewpoint -->
<div class="poc">
<div class="tr45deg">3D rotated element</div>
</div>
<!-- Top-left viewpoint -->
<div class="pol">
<div class="tr45deg">Viewed from the left</div>
</div>