居中总结

居中:盒子在其包含块中居中

行盒(行块盒)水平居中

直接设置行盒(行块盒)父元素text-align:center

常规流块盒水平居中

定宽,设置左右margin为auto

绝对定位元素的水平居中

定宽,设置左右的坐标为0(left:0, right:0),将左右margin设置为auto

实际上,固定定位(fixed)是绝对定位(absolute)的特殊情况

单行文本的垂直居中

设置文本所在元素的行高,为整个区域的高度

行块盒或块盒内多行文本的垂直居中

没有完美方案

设置盒子上下内边距相同,达到类似的效果。

绝对定位的垂直居中

定高,设置上下的坐标为0(top:0, bottom:0),将上下margin设置为auto