Style perspectiveOrigin 속성

정의와 사용법

perspectiveOrigin 속성을 정의하여 3D 요소가 x축과 y축에서 위치하는 위치를 정의합니다. 이 속성은 3D 요소의 하단 위치를 변경할 수 있습니다.

요소의 perspectiveOrigin 속성에 대해, 위치는 자식 요소가 아니라 요소 자체에 대해 정의됩니다.

주석:이 속성은 perspective 속성 함께 사용하여 3D 변환 요소에만 영향을 미칩니다!

추가 참조:

JavaScript Style 객체:perspective 속성

CSS 참조 매뉴얼:perspective-origin 속성

예제

3D 요소의 기준 위치 설정:

document.getElementById("myDIV").style.perspectiveOrigin = "10px 50%";

본인이 직접 시도해 보세요

문법

perspectiveOrigin 속성 반환:

object.style.perspectiveOrigin

perspectiveOrigin 속성 설정:

object.style.perspectiveOrigin = "x-axis y-axis|initial|inherit"

속성 값

값 설명
x-axis

시각화가 x축에 위치하는 위치를 정의합니다.

  • left
  • center
  • right
  • length
  • %

기본 값: 50%
y-axis

시각화가 y축에 위치하는 위치를 정의합니다.

가능한 값:

  • top
  • center
  • bottom
  • length
  • %

기본 값: 50%
initial 이 속성을 기본 값으로 설정합니다. 참조: initial。
inherit 부모 요소에서 이 속성을 继承합니다. 참조: inherit。

기술 세부 사항

기본 값: 50% 50%
반환 값: 문자열로, 요소의 perspective-origin 속성。
CSS 버전: CSS3

브라우저 지원

표에 나타난 숫자는 해당 속성을 최초로 완전히 지원하는 브라우저 버전입니다.

크롬 에지 파이어폭스 사파리 오페라
크롬 에지 파이어폭스 사파리 오페라
36.0 10.0 16.0 6.1 23.0