2D位移
- transform:translate(x,y); 元素单位px 可以是负值
- transform:translatex(x);
- transform:translatey(y);
2D缩放
- transform:scale(sx,sy); 元素单位none
- transform:scalex(sx);
- transform:scaley(sy);
1=不变,2=放大一倍,0.5=缩小一倍
2D倾斜
- transform:skew(ax,ay); 元素单位deg
- transform:skewx(ax); 水平方向向左倾斜
- transform:skewy(ay); 垂直方向向下倾斜
transform:skew(数值); 当只有一个数值时,是x轴方向向左的倾斜
2D旋转
- transform:rotate(a); 元素单位deg
- a为正数时,从中心点向右旋转;
- a为负数时,从中心点向左旋转。
想让一个图片既移动,又放大,可以这样写吗?
transform:translate(x,y);
transform:scale(sx,sy);
答案:不可以,后台读取代码的时候,读到第二个认为是一个全新的transform语句,会覆盖第一个transform,所以需要用复合写法,不同的元素之间用空格隔开。