位移 translate
定位
会影响其他盒子位置(脱离标准流);
行内元素定位,直接变为块级元素;
移动
不影响其他元素的位置;
对行内元素无效;对块级元素生效;
子元素居中
.parent {
width: 500px;
height: 500px;
border: 1px solid #000;
position: relative;
}
.son {
width: 200px;
height: 200px;
background-color: pink;
position: absolute;
left: 50%;
top: 50%;
/* 沿着X轴 Y轴 负方向 移动 自身宽高的一半*/
transform: translate(-50%, -50%);
}