css居中总结（行盒(行块盒)水平居中、常规流块盒水平居中、浮动块盒水平居中、绝对定位元素的水平居中....）

定义：居中是指盒子的其包含块中居中

行盒（行块盒）水平居中

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

常规流块盒水平居中

1. 定宽, 设置左右margin为auto;

浮动块盒水平居中

1. 一般会通过设置magin手动居中

绝对定位元素的水平居中

1. 定宽，设置左右的坐标为0 (left:0,right:0),将左右的margin设置为auto , (因为不是常规流，所以不同只通过定宽，
   左右margin设置为margin实现居中)

注： 实际上，固定定位(fixed)是绝对定位(absolute)的特殊情况 ，所以固定定位跟绝对定义一样

------区别: 固定定位相对于视口 ，绝对定位相对于最近一级的 定位不是 static 的父元素来进行定位

单行文本的垂直居中

1. 设置文本所在元素的行高，为整个区域的高度(height = line-height)

   例： height = 50px;  line-height = 50px;
   

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

1. 没有完美方案，设置盒子上下内边距相同，达到类似的宽度

2. 也可以用一个元素包裹住内容，用绝对定位

绝对定位的垂直居中

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