CSS 垂直居中常用的多种方法
垂直居中是布局中十分常见的效果之一，在面试中也是经常问到的点；CSS布局还是采取截图把代码贴出来，因为想学习只有敲出来才会有理解，只看或者复制粘贴当时都会说嗯嗯嗯。。。妙啊
①display:table-cell(此方法适用子节点没有固定宽高)
结果：
②定位和负边距(此方法对子节点没固定宽高不适用)
结果：
③ 定位和0(此方法对子节点没固定宽高不适用)
结果：
④定位和transform(此方法适用子节点没有固定宽高)
结果：
注： Internet Explorer 9 支持替代的 -ms-transform 属性（仅适用于 2D 转换）
Safari 和 Chrome 支持替代的 -webkit-transform 属性（3D 和 2D 转换）
⑤ display:flex(IE不支持)
关于flex布局，相信每一位合格的前端开发人员都会去参考阮一峰老师的flex布局教程
Flex布局语法篇
Flex布局实例篇
结果：
⑥display:flex和margin:auto(此方法适用子节点没有固定宽高)
结果：