元素居中处理

主要介绍元素垂直的一些技巧，水平同理

1、vertical-align: middle;

前提：父元素display: table-cell; vertical-align: middle;

2、align-items: center;

前提：父元素display: flex; align-items: center;

3、align-self: center;

前提：父元素display: flex; 子元素align-self: center;

4、transform: translateY(-50%)

前提：子元素存在定位，top: 50%; transform: translateY: (-50%);

5、margin: auto;

前提：子元素相对父元素绝对定位position: absolute; top; 0; bottom: 0; margin: auto;

6、line-height: xxx;

前提：子元素为单行文本， line-height: xxx; (xxx为父容器height大小)