CSS Transform的martix矩阵

最近接触都 martix 矩阵变换，查找了一些资料，在此记录一下

所有的 tranform 变换其实都是基于 martix 矩阵实现的，只是 css 给我们提供了 rotate,skew,translate……等方法而已，我们先看一个图：

我们只要知道是怎么计算的就行了，假设 martix(a,b,c,d,e,f),没有任何变换时：martix(1,0,0,1,0,0);

scale(缩放): x’ = ax;
y’ = dy;

rotate(旋转):假设旋转的度数为 o，则 martix 是(cos(o),sin(o),-sin(o),cos(o),e,f);

skew(拉伸):假设 x 为 x 轴倾斜角度，y 为 y 轴倾斜角度,martix(a,tan(y),tan(x),d,e,f);

translate:x 轴偏移量就是 e,
y 轴偏移量就是 f

镜像变化:martix(-1,0,0,1,0,0)

获取一个元素的 martix 矩阵的方法是：document.defaultView.getComputedStyle(‘元素名’, null).transform;