css水平垂直元素居中全指南

想要怎么样的居中？

1 水平居中

inline的元素水平居中
     css{
        text-align:center;
        }；
    block的元素水平居中
     css{
        margin:0 auto;
        }；

2 垂直居中

inline水平/如文本的元素水平居中
    1 单行文本垂直居中
        父元素盒子高度=行高

    2 多行文本垂直居中
        表格中的单元格文本默认垂直居中
        使用flexbox flex-direction: column;
        使用vertical-align;
        justify-content: center;
    block的元素水平居中
    1 已知元素高度
      使用绝对定位的方式+负的margin值
    2 未知元素高度
      使用绝对定位的方式+transform: translateY(-50%);
    3 使用flexbox 

3 水平垂直居中

1:已知宽高
      使用绝对定位的方式+负的margin值
    2:未知宽高
      使用绝对定位的方式+transform:translate(-50%,-50%);
    3：使用flexbox
      .parent {
            display: flex;
            justify-content: center;
            align-items: center;
        }