一、问题提出
----
绝对定位 不能通过 设置 margin: auto; 样式的方式 , 设置盒子模型水平居中 ;
相对定位 的 盒子模型 , 并没有脱离标准流限制 , 仍然可以使通过设置 margin...轮播图中的 五个小圆点 的容器需要居中对齐 ;
二、绝对定位 居中设置
----
1、设置固定尺寸
使 绝对定位 元素 水平 / 垂直 居中 最简单的方法就是 使用标尺测量父容器的宽高 , 通过设置四个边的边偏移量..., 设置元素 水平 / 垂直 居中 ;
2、先偏移50%再回退固定值
父容器 盒子 如果尺寸发生了改变 , 使用上述固定边偏移的方式设置的居中就会出现问题 ;
先设置 50% 的 宽度 / 高度 偏移量..., 然后再往回退 盒子一半 宽度 / 高度 的偏移量 ;
以 水平居中为例 : 200 x 200 大小的盒子 , 通过设置
首先 , 设置 left 左边偏移为 50% , 让子元素的左侧 移动到...子元素的宽度 ;
margin-left: -100px;
三、绝对定位元素 水平 / 垂直 居中
----
为 80x80 像素尺寸的元素设置 水平 / 垂直 居中 ;
设置水平居中 : 先设置子元素左侧移动到水平中心位置