transform--2D转换位移
什么是2D转换？就是在平面中的形态变化。
语法
- x就是x轴上移动位置 y 就是y轴上移动位置 中间用逗号分隔
transform: translate(x, y);
transform: translate(100px, 100px);
- 我们如果只移动x坐标
transform: translate(100px, 0);
transform: translateX(100px); - 我们如果只移动y坐标
transform: translate(0, 100px);
transform: translateY(100px);
废话不多说，上案例：
/* 移动盒子的位置： 定位 盒子的外边距 2d转换移动 */
div {
width: 200px;
height: 200px;
background-color: skyblue;
}
div:first-child {
transform: translate(60px, 60px);
}
div:last-child {
background-color: rgb(0, 13, 128);
}
<body>
<div>A</div>
<div>B</div>
</body>
输出结果
输出结果
