3d기본 (1) 썸네일형 리스트형 <CSS 기초> 16. 3D 기본 1. 3D로 만들기 * 비틀기 - 간단하게 옆으로 살짝 비틀어진 카드를 만든다고 가정하자. 그러면 우리는 다음과 같이 작성할 수 있다. transform: rotateY(45deg); - 3d 형태로 옆으로 45도 돌린 속성을 주기위해 원하는 곳에 위와 같은 트랜스폼 속성을 줄 수 있다. - 하지만 실제로 이렇게 해보면 3D라 하기엔 어색하고 납작하다. 이 때 필요한 것이 perspectiv속성이다. * 속성 - 위의 부모태그를 3D공간으로 만들면 위의 카드가 3d처럼 보인다. perspective : 500px; - 500px은 눈에서의 거리라고 볼 수 있다. 즉 0에 가까워질수록 모양의 변화가 극대화되어 보인다. - 위의 속성에도 불구하고 또 다른 문제가 생긴다. 부모안에 여러개의 3D 카드들을 넣으.. 이전 1 다음