如何使元素垂直水平居中

在css中使元素垂直水平居中十分常见，那么我来抛砖引玉，分享几种我知道的方法

1.弹性盒方法——flex布局
元素：display: flex;justify-content: center;align-items: center;

2.定位+transform：
父元素 position: relative
子元素 position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%)

3.纯absolute
父元素 position: relative
子元素 position: absolute;top: 50%;left: 50%; margin-left:-1/2子元素宽度; margin-top: -1/2子元素高度;

4.margin：auto+absolute
父元素 position: relative
子元素 position: absolute；top: 0； left: 0; right:0; bottom:0;margin:auto

5.table-cell
父元素上一层：display table
父元素: display: table-cell;vertical-align: middle;text-align: center;
子元素：display: inline-block;

6.inlineblock法：
父元素：
text-align: center;
line-height: 父元素高度
font-size: 0;
子元素：
display: inline-block;
background-color:yellow;
vertical-align:middle;

以上就是我知道的方法，如有错误和遗漏欢迎指正。