【CSS】9-css变形

9-css变形

transform变形

1.位移：translate(x轴偏移量，y轴偏移量)

#div1:hover {
	transform: translate(20px, 20px);
}

2.缩放：scale(放大的倍数),如果为小数是缩小，如果为负数则会反转

#div2:hover {
    transform: scale(0.8);
}

3.倾斜：skew(角度deg)

#div3:hover {
	transform: skew(45deg);
}

4.旋转：rotate(角度deg)根据中心点旋转，rotateY（角度deg)根据y轴旋转

#div4:hover {
	/* transform: rotate(90deg); */
	transform: rotateY(90deg);
}