2D转换

2D转换(translate)

1.语法

2.重点

• 定义2D转换中的移动，沿着X和Y轴移动元素

• translate最大的优点：不会影响到其他元素的位置

• translate中的百分比单位是相对于自身元素的translate:(50%,50%)

• 对行内标签没有效果

3. 2D转换之旋转(rotate)

4. 2D转换中心点（transform-origin）

1.语法

2.重点

5. 2D转换之缩放（scale）

1.语法

transform:scale(n)等比例缩放，即长宽同时缩放

2.重点

5. 2D转换的综合写法

注意：

1. 同时使用多个转换，其格式为：transform: translate() rotate() scale() ...等

2. 其顺序会影响转换的效果。（先旋转会改变坐标轴的方向）

3. 当我们同时有位移和其他属性的时候，记得要将位移放到最前

2D转换总结