css不定宽高的垂直水平居中

今天又用到这个了，那就写一下吧！

css垂直水平居中用的还是比较多的

1.最简单的flex布局,分为两层容器，外层容器加上如下样式即可

display: flex;
justify-content: center;
align-items: center;

2.这一种是利用table-cell，这个也是很不错的。

外层容器

display:table-cell;
text-align:center;
vertical-align:middle;

内部元素

vertical-align:middle;
display:inline-block;

3.第三种其实和知道宽高的那中是挺像的，不过这个用的transform

外层容器

display:relative

内部元素

transform: translate(-50%,-50%);
position: absolute;
top: 50%;
left: 50%;

这三个是比较实用的，暂时只列举这三个！