○Transform

 ▷해당 요소를 변환시킨다.

 ▶종류

  ▷-webkit-transform

  ▷-ms-transform

  ▷transform

 

 ▶translate(x, y)

  ▷해당 요소를 주어진 x축, y축의 거리만큼 이동

 

 ▶rotate(deg)

  ▷해당 요소를 주어진 각도만큼 회전 (양수-시계 방향)

 

 ▶scale(width-scaling, height-scaling)

  ▷해당 요소를 주어진 각도만큼 회전 (양수-시계 방향)

 

 ▶skew(degX, degY)

  ▷해당 요소를 X, Y축으로 주어진 각도만큼 기울임.

 

 ▶matrix(scaleX(), skewY(), skewX(), scaleY(), translateX(), translateY())

  ▷위의 식들은 한 번에 사용가능

 

 ▶rotateX(deg) / rotateY(deg) / rotateZ(deg)

  ▷X/Y/Z축을 기준으로 회전시킴

  ▷webkit에서만 사용 가능

 

 ▶각종 3D메서드

  ▷translate3d(x, y, z) / rotate3d(x, y, z) / scale3d(x, y, z)

  ▷입체적으로 보여지는 3D 변형

  ▷webkit에서만 사용 가능

 

 ▶perspective(px)

  ▷원근감 표현에 사용하는 픽셀 수 지정

'컴퓨터 언어 > CSS' 카테고리의 다른 글

Animation  (0) 2020.10.03
Transition  (0) 2020.10.03
Vender prefix  (0) 2020.09.30
Gradient  (0) 2020.09.30
Color  (0) 2020.09.29

+ Recent posts