CSS perspective 속성

정의와 사용법

perspective 속성은 3D 요소가 뷰에 있는 거리를 픽셀로 정의합니다. 이 속성은 3D 요소를 보는 시점을 변경할 수 있습니다.

perspective 속성을 요소에 정의할 때, 자식 요소는 요소 자신보다 투시 효과를 받습니다.

비고:perspective 속성은 3D 변환 요소에만 영향을 미칩니다.

푸시트:이와 함께: perspective-origin 이 속성과 함께 속성을 사용하여 3D 요소의 아래 위치를 변경할 수 있습니다.

CSS3 튜토리얼:CSS3 3D 변환

HTML DOM 참조 설명서:perspective 속성

요소가 검토되는 위치의 뷰를 설정합니다:

div
{
perspective: 500;
}

perspective: number|none;

값	설명
number	요소가 뷰에 있는 거리, 픽셀로 계산됩니다.
none	기본 값. 0과 같습니다. 투시를 설정하지 않습니다.

표에 나타난 숫자는 이 속성을 완전히 지원하는 첫 번째 브라우저 버전을 기재합니다.

prefix를 사용하는 숫자는 사용된 첫 번째 버전을 나타냅니다.

크롬	IE / 엣지	파이어폭스	사파리	오페라
36.0 12.0 -webkit-	10.0	16.0 10.0 -moz-	9.0 4.0.3 -webkit-	23.0 15.0 -webkit-