未知宽高
1、把父元素设置成table，子元素为table-cell，然后用vertical-align：center
优点：父元素可以改变高度
缺点：IE8以下不支持，且对img无效果
2、用一个空标签并设置vertical-align的基准线为中间，并让它inline-block，宽为0，高度100%
缺点：多了没用的空标签，且转为行内块
IE6、7不支持 （可用_zoom：1；*display：inline解决兼容）
3、让该元素的父元素line-height=height，并转成行内块，在vertical-align
缺点：只适用于HTML5
已知宽高
给父元素相对定位，子元素绝对定位
1、绝对定位；margin：auto；top：0；left：0；bottom：0；right：0；
2、绝对定位；top：50%；向上移动高的一半（负数）
left：50%；向左移动宽的一半（负数）
3、绝对定位；top：50%；left：50%；transform：translate（-50%，-50%）
已知或未知
给父元素body加（display：flex；justify-content：center；align-items：center）
给html、body加（height：100%）
css实现水平垂直居中
原文地址：https://www.cnblogs.com/tis100204/p/10297117.html