块级元素和行内元素多种——水平，垂直、水平垂直居中的方法

1、水平居中：

A、直接设置div属性：margin：0 auto；

B、父元素属性text-align：center；（对块级元素没有用）：

C、div设置属性
position：relative；（这是相对于父元素）
margin：auto；
left：0；
right：0；

D、给父div设置属性：justify-content：center；
display：-webkit-flex；

2垂直居中：

a、父级元素设置：height：n px；
line-height：n px；
二者的值相同；

b、设置父级元素属性：
display：table-cell；
vertical-align：center；

水平垂直居中：

水平居中的与垂直居中混合使用：
水平居中：A、B、C、D
垂直居中：a、b
其他居中：使用计算的方法：
从left，right，margin，padding等跟位置调整有关的元素都可以设置；
前提是需要对position进行设置；
这个就看着搭配；（重点需要记住，有些居中是对块级元素无效的；）

再补一个垂直水平居中的：父级元素属性设置：
justify-content：center；
align-items：center；
display：-webkit-flex；