transform - rotate / scale / skew / translate / trnasform-origin

transform 속성을 이용하면 회전, 크기조절, 기울이기, 이동 효과 등을 나타낼 수 있습니다. rotate 돌아가는 각도 설정이 가능합니다. transform: rotate(원하는 각도 deg); transform: rotateX(Ndeg); transform: rotateY(Ndeg); transform: rotate(Ndeg); /*deg: degree*/ .box_a: hover{ transform: rotate(20deg); } 마우스를 대면 20도 돌아갑니다. scale 크기 조절이 가능합니다. transform:scale(원하는값 // 원래크기기준:1) transform:scaleX(); transform:scaleY(); transform:scale(X축비율, Y축비율); .box_a: hover{ transform: scale(2); } 마우스를 대면 2배 커집니다. /*1이 원래 크기, 0.5는 절반, 2는 2배*/ skew 경사를 조절할 수 있습니다.(기울어짐...

원문링크 : transform - rotate / scale / skew / translate / trnasform-origin