css--元素水平垂直居中的方法

这是考察css的基础的问题，一般有过开发经验的至少都能答出来1-2种
如果你能回答3-4种，那么就会给面试官留下你的知识比较全面的印象。

水平居中：

1. 行内元素：
 text-align: center;

2. 块级元素 
margin: 0 auto;

3. 绝对定位50% + 自我位移50%
position:absolute;
left: 50%;
transform: translateX(-50%);

4. flex布局
display:flex;
justify-content: center;

垂直居中

5. 设置行高值为本元素的高度：
height: 100px;
line-height: 100px;

6. 绝对定位50% + 自我位移50%：
position:absolute;
top: 50%;
transform: translateY(-50%);

7. flex布局
display:flex;
align-items: center;

8. table布局
父元素：
display:table;
子元素：
display: table-cell;vertical-align: middle;