translate:位移(值是像素)
tranform:translateX()
两个值宽高,不设置的话写0
scale:缩放
(值是一个比例值,正常大小就是1)
也分为X、Y、Z
两个值、宽高
一个值宽高
rotate:旋转(值是角度 deg )
也分为X、Y、Z(X和Y是3d)
Z和rotate是等级关系,正值按顺时针旋转,负值按逆时针旋转
skew:斜切(单位也是角度)
分为X、Y(不存在3d效果)
正值向左倾斜,负值向右倾斜
注意事项:
1、变形操作不会影响到其他元素
2、变形操作只能添加给块元素,不能添加给内联元素(无效果)
3、复合写法,可以同时添加多个变形操作(通过空格的方式添加第二个变形)
执行有顺序,先执行后面的操作,再执行前面的操作
translate 会受到 rotate、scale、skew 的影响
基点的位置:
旋转默认会以中心点进行旋转,可以加一个基点位置
transform-origin:值用数值也可以用单词也可以
超出容器范围也可以
原文:https://www.cnblogs.com/moodblog/p/14226416.html