transform有多種屬性,例如rotate、scale、translate,但這里需要提醒大家的,以往我們疊加效果都是用逗號(”,”)隔開,但transform中使用多個屬性時卻需要用空格隔開。注意一定是空格隔開。
transform:rotate():旋轉;單位deg,正數表示順時針旋轉,值為負數,則表示逆時針旋轉。
transform:translate():移動;單位px,為復合屬性,transform:translateZ()和transform:translate3d為3D屬性。
translateX(x)水平方向移動;translateY(Y)垂直方向移動。
translate(x,y)水平方向和垂直方向同時移動。
transform:scale():比例;比例放大用正數,縮小則為負數
transform: translate(100px,200px);translate移動
transform: rotate(45deg);旋轉
transform: scale(2);放大