#### **transform有哪些属性及其基本使用** **transform(变形)是CSS3中的元素的属性，transform的属性值主要包括旋转rotate、扭曲skew、缩放scale和移动translate以及矩阵变形matrix** 1、`transform:rotate(30deg),2D`旋转，正值为顺时针旋转，负值为逆时针旋转，默认旋转基点是中心点，也可以通过`transform-origin（X,Y）`改变基点。 2、`transform:skew(30deg,10deg)`,注意，这里的X轴和Y轴与我们平时认为的坐标系的XY轴正好相反；且X轴正值是逆时针变形，而Y轴正值是顺时针变形。基点默认为中心点。另外还有`skewX`、`skewY`，分别用来设置单一方向上的扭曲。可以通过t`ransform-origin（X,Y）`改变基点 3、`transform：scale（2,1.5）`，表示在水平方向（X轴）缩放2倍，在垂直方向（Y轴）缩放1.5倍。基本默认为中心点。这里的X、Y轴指的是像坐标系一样的X、Y轴，与`transform:skew（X,Y）`的X Y轴不同。 另外同样有`scaleX(<number>) `、`scaleY(<number>)`用来分别设置单一方向上的缩放。可以通过`transform-origin（X,Y）`改变基点。 4、`transform：translate（100px，20px）`，表示在水平方向上移动100px；在垂直方向上移动20px，比较好理解，另外也同样有`translateX、translateY`值分别设置单一方向上的位移，可以通过`transform-origin（X,Y）`改变基点。