2D转换
rotate 转换 指定一个平面类的旋转
有兼容性 可以在前面加上 -webkit- 谷歌内核 -o- opera 内核 -ms- ie内核 -moz-火狐内核
语法:rotate(deg)正顺时针负数逆时针
transform:translateX(相对单位 单位px em 百分比)水平x轴移动 移动顺序左到右 负值右到左
transform:translateY(相对单位 单位px em 百分比)水平垂直Y轴移动 移动顺序上到下 负值 下到上
transform:translate(第一个参数为x,第二个参数为y) 重点 第一个单位x轴不可省略 y轴可以
缩放
有兼容性 可以在前面加上 -webkit- 谷歌内核 -o- opera 内核 -ms- ie内核 -moz-火狐内核
transform:scaleX(单位为0.1开始 1代表不变 超出1的话图片会被拉伸) 往X轴缩放
transform:scaleY(单位0.1开始 1代表不变 超出1的话图片会拉伸) 往Y轴缩放
transform:scale(x,y) 重点 第一个单位x轴不可省略 y轴可以
transform:scale(-1,1)翻转
斜切
transform:skewX ( 0deg) 正值逆 逆值顺
transform:skewY(0deg)正值顺 逆值负
transform:skew() 第一个值为x ,第二个值为Y 如果只设置了第一值 那么第二个默认为0
transform-orign:(x,y,z)设置元素在哪个点旋转 默认是50%,50%