水平居中的方法

1，最简单的方法，设定一个width值，并把margin设为 0 auto。限制：元素需要是块级元素，而且要知道长度。

div{
        width: 100px;
        margin: 0 auto;
}

2,行内元素直接把text-align设为center

3，绝对定位法,先把左侧边距设为50%，再通过translate把自己往左挪动50%。

div{
    position: absolute;
    left: 50%;
    -webkit-transform: translate(-50%,0);
    -ms-transform: translate(-50%,0);
    -o-transform: translate(-50%,0);
    transform: translate(-50%,0);
}

假如知道宽度

div{
    position: absolute;
    width: 100px;
    left: 50%;
    margin-left: -50px;
}

4,inline-block
把自己设为inline-block，把父元素的text-align设为center。

5，flex布局