perspective는 관점이라는 뜻으로만 알고 있었는데, 원근법이라는 뜻이 있었다. 관점과 연관이 있는 뜻인 것 같아 알아두는 데 무리는 없을 것 같다:)
CSS의 perspective 속성은 부모 요소에 적용 시 자식 요소를 해당 거리만큼 떨어져서 보는 효과를 준다. 즉 0에 가까운 수를 쓰면 매우 크게 보인다.
참고) 아래 child는 rotateX(45deg) 상태다.

perspective: 0

perspective: 900px /*900px만큼 떨어져서 본다는 뜻*/

perspective-origin

소실점의 위치에 따라 나뉜다.

perspective-origin: top left;

위 경우 거리가 가까워질수록 위와 왼쪽이 소실된다.

transform-style: preserve-3d

perspective의 속성은 직계 자식 요소에게만 적용되며 더는 상속되지 않는다. 이를 상속시킬 수 있게 해주는 속성이 바로 transform-style: preserve-3d 속성이다.

참고) ChildChild는 rotateY(50deg) 되어 있다.
preserve-3d 적용 X

preserve-3d 적용 O

P.S. 카드 뒤집기 CSS에 동적인 효과를 주기 위해 자주 쓰이는 것 같다.

참고 블로그

---

https://nykim.work/26
https://velog.io/@wswy17/CSS-perspective-%EC%9B%90%EA%B7%BC%EB%B2%95