[CSS] transform / translate, scale, rotate, skew

transform 

요소의 모양, 크기등을 조절하고 기울기, 이동효과를 줄 수 있다. 

 

transform : translate ();

지정한 위치로 X축, Y축 만큼 이동시킨다.

transform : translateX(num);
transform : translateY(num);
transform : translate(num1,num2);

 

transform : scale();

지정한 크기만큼 X축, Y축으로 확대 또는 축소할 수 있다.

transform : scaleX(num);
transform : scaleY(num);
transform : scale(num1,num2);

trans: rotate();

지정한 크기만큼(각도만큼) 회전시킨다.

transform : rotateX(num);
transform : rotateY(num);
transform : rotate(num1,num2);

 

transform :  skew();

지정한 크기만큼 X축 또는 Y축으로 기울인다.

 

transform : skewX(num);
transform : skewY(num);
transform : skew(num1,num2);

transform : none;

translate()를 리셋시켜줌