div盒子垂直居中

比较推荐的办法：

1.display:flex。

如果想正常纵向排列，加上flex-direction:column;

.parent{

display:flex;

justify-content:center;

align-items:center;

}

2.定位+transform

定位中心点是盒子的左上顶点，所以定位之后我们需要回退盒子一半的距离。

.parent{

position:relative;

}

.child{

position:absolute;

top:50%;

left:50%;

transform:translate(-50%,-50%);

}

3.定位+margin:auto

.parent{

position:relative;

}

.child{

position:absolute;

margin:auto;

top:0;

left:0;

right:0;

bottom:0;

}