变形
transform 变形
transform:translate()平移
transform:translatex(1px)x轴平移
transform:translatey(1px)y轴平移
同时写x轴和y轴的的话,会被下面的覆盖
复合属性:transform:translate(100px,100px)
缩放
transform:scale缩放
transform:scale(1) 一个值表示x轴y轴都是1(1表示不变)
transform:scale(0) 表示缩小到消失
ransform: scale(2,1) 放大x轴
transform: scale(1,2) 放大y轴
旋转
transform:rotatex(30deg)(沿着x轴旋转,改变高度)
transform:rotatey(30deg)(沿着y轴旋转,改变宽度)
复合属性:transform:rotate(30deg)(只能设置1个值)
倾斜
transform:skew倾斜
transform:skew(60deg,20deg)
第一个参数表示x轴,按照逆时针进行旋转;宽度变化,高度不变
第二个参数表示y轴,按照顺时针进行旋转;高度变化,宽度不变