📖 최성일, ⌈Do it! 인터랙티브 웹 페이지 만들기⌋, 이지스퍼블리싱, 2021
.wrap {
width: 100vw;
height: 100vh;
perspective: 1300px; /* 원근감 지정 */
}
/* 3D 회전과 이동 */
.face1 {
transform: rotateY(0deg) translateZ(-764px);
}
...
각 요소를 3D 형태로 배치하기 위해 transform 속성을 사용할 수 있고, 이를 의도대로 요소에 적용하려면 원근감을 주는 perspective 속성을 함께 지정해 주어야 한다는 것을 학습했다.