垂直居中或者水平居中的方法积累

这是垂直居中的基础内容：

水平居中：

    文本居中有：text-align:center;

   已知宽度的块级元素：margin:0 auto;

   表格居中：display:table;

     已知宽度，用子绝父相：父：position:relative; 子：position:absolute;left:50%;width:150px;margin-left:-75px;

   未知宽度：父：position:relative; 子：position:absolute;-webkit-transform:translateX(-50%);transform:translateX(-50%;

垂直居中：

    文本垂直居中：line-height:(父元素的高度)

    vertial-align:middle;

    定位的方法：父：position:relative; 子：position:absolute;top:50%;height:150px;margin-top:-75px;

垂直水平居中：

    1.未知高度的情况下利用inline-block和vertical-align

    2.在高度宽度已知的情况下，用绝对定位实现垂直水平居中

   3.在高度宽度未知的情况下, transform: translate(-50%,-50%);

    4.在高度宽度未知的情况下，display: flex;justify-content: center;align-items: center;注意兼容性。