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);放大