CSS 2D Matrix使用方法记录

仅用于记录2D的Matrix使用方法。

3D的Matrix为4*4矩阵。

语法：

matrix(a, b, c, d, tx, ty)

a b c d
描述线性变换的number。

tx ty
描述如何应用这个变换的number 。

这些值表示以下函数:
matrix( scaleX(), skewY(), skewX(), scaleY(), translateX(), translateY() )

因为在多个变换同时作用时，需要几个矩阵相乘，所以矩阵都必须行列相等，为3*3。第三行一定是0 0 1

示例:

.demo{
    transform-origin: 0px 0px;
    transform: rotate(45deg) translate(100px, 0) scale(2);
}

 三个矩阵相乘

.demo{
   transform-origin: 0px 0px;
   transform: matrix(1.41421, 1.41421, -1.41421, 1.41421, 70.7107, 70.7107);
}