CSS 오프셋 라운드 속성

정의와 사용법

offset-rotate 속성은 경로를 따라 이동하는 애니메이션 요소의 회전 각도를 설정합니다.

경로를 따라 이동하는 세 개의 <img> 요소의 회전 각도를 설정합니다:

#fish1 {
  offset-rotate: auto;
}
#fish2 {
  offset-rotate: auto 90deg;
}
#fish3 {
  offset-rotate: 90deg;
}

deg 대신 turn 단위로 요소의 회전 각도를 지정하십시오:

div {
  offset-rotate: 0.25turn;
}

offset-rotate: auto|angle|initial|inherit;

값	설명
auto	요소가 경로를 따라 이동하는 방향을 향합니다. 기본 값.
angle	요소를 일정한 각도로 회전하는 데 사용
auto angle	auto와 함께 지정 angle이미지, 기본 회전 각도에 추가됩니다. 시계 방향.
reverse	요소가 기본 회전 방향과 반대 방향으로 회전합니다.
initial	이 속성을 기본 값으로 설정합니다. 참조: initial.
inherit	부모 요소에서 이 속성을 상속합니다. 참조: inherit.

기본 값:	auto
상속성:	아니요
애니메이션 제작:	지원됩니다. 참조:애니메이션 관련 속성.
버전:	CSS3
JavaScript 문법:	object.style.offsetRotate="45deg"

표에서의 숫자는 이 속성을 최초로 완전히 지원한 브라우저 버전을 나타냅니다.

크롬	에지	파이어폭스	사파리	오페라
56	79	72	16	43