728x90
transform :변환함수1 변환함수2 변환함수3;
transform : 원근법 이동 크기 회원 기울임;
* 2D
이동 - translate(x,y)
translateX(x)
translateY(y)
크기 - scale(x,y)
scaleX(x)
scaleY(y)
회전 - rotate(deg)
비틀기 - skew(x-deg,y-deg)
skewX(x-deg)
skewY(y-deg)
전체 적용 - matrix(n,n,n,n,n,n)
*3D
이동 - translate3d(x,y,z)
translateZ(z)
크기 - scale3d(x,y,z)
scaleZ(z)
회전 - rotate3d(x,y,z,a)
rotateX(x)
rotateY(y)
rotateZ(z)
거리 - perspective(n)
전체 적용 - matrix3d(n,n,n,n,n,n,n,n,n,n,n,n,n,n,n,n) - n16개
* z축의 이동은 perspective의 설정이 있어야 확인 가능하며 transform 사용 시 제일 앞에 선언되어야 함(px로 입력)
'css' 카테고리의 다른 글
animation (0) | 2020.07.05 |
---|---|
transform(변환 속성) (0) | 2020.07.04 |
Transitions(전환) (0) | 2020.07.04 |
속성 선택자 with ^, $ (0) | 2020.07.03 |
속성 선택자(Attribute Selector) (0) | 2020.07.03 |