绝对定位的盒子如何水平/垂直居中显示

绝对定位的盒子水平居中

绝对定位/固定定位的盒子，是不能通过设置margin：auto；来实现水平居中的。

在使用绝对定位时实现水平居中，可以使用如下图所示的方法：

1. left：50%；：先让盒子左侧移动到父级元素的水平中心位置；
2. margin-left：-100px;:再让盒子向左移动自身宽度的一半。

绝对定位的盒子垂直居中

1. top: 50%;：先让盒子上侧移动到父级元素的垂直中心位置
2. margin-top: -50px;：再让盒子向上移动自身高度的一半