1.首先很感谢博主的分享https://www.cnblogs.com/Ivy-s/p/6786622.html#4171054,然后我在这里记录一下自己的收货。
正文:
1)transform: matrix(1,0,0,1,0,0);//初始值
a:1 c:0 e:0 x 1
b:0 d:1 f:0 · y = 1
0 0 1 1 1
x`=ax+cy+e
y`=bx+dy+f
1 .contain{ height: 300px; width: 300px;border: 1px solid red;background-color: beige;margin: 50px auto;}2 .mian{ height: 100px;width: 50px;border: 1px solid black;background-color: lightblue;transform: matrix(1,0,0,1,0,0);//初始值}
2)transform: matrix(1,0,0,1,100,50);//X平移100,y平移50
3)transform: matrix(2,0,0,2,100,50);//平移后,X,y放大2倍
4)transform: matrix(0.2588,0.9659,-0.9659,0.2588,0,0);//旋转75度
matrix(cos75,sin75,-sin75,cos75,0,0)
cos75≈0.2588
sin75≈0.9659
a:cos75 c:-sin75 e:0 x
b:sin75 d:cos75 f:0 · y
0 0 1 1
5)transform: matrix(1,0,0.577,1,0,0);//拉伸30度(X轴向前伸展,Y轴与图形右边线形成30度夹角)
matrix(1,tan(θy),tan(θx),1,0,0)
主要根据上文博主中提到的线代来计算
x'=ax+cy+e
y'=bx+dy+f