在页面布局中经常会涉及到各种居中问题，下面统计下经常用到的各种居中方法：
1.行内元素的水平居中
如果父元素是块级元素，那直接给父元素设置 text-align：center
样式设置如下：
css 1
效果如下：
行内元素水平居中
2.行内元素的垂直居中
1.单行元素
单行元素设置行高等于box的高。样式如下：
单行样式设置行高
效果如下：
单行元素垂直居中
2.多行行内元素
以下只列举一种实现方法。利用display：table-cell和vertical-align:middle;
多行行内元素
效果如下：
多行行内元素
3.块级元素的水平居中
块级元素的水平居中方法比较简单，利用margin就能实现：
水平居中
4.块级元素的垂直居中
垂直居中
主要是利用的position定位和top：50%，margin-top是元素height的一半来实现的。
还有使用display：flex的定位方法来实现垂直居中，此处不一一列举了。
