1.先让盒子的上下边缘和父盒子的垂直中心线重叠，然后让子盒子往回移动自身高度的一半
```
.f{
width: 200px;
height: 200px;
position: relative;
}
.z{
width: 100px;
height: 100px;
position: absolute;
margin-top: 100px;
top: -50px;
}
```
2.使用dispaly:table-cell和vertical-align:middle使盒子以表格的形式呈现
```
.f{
width: 200px;
height: 200px;
display: table-cell;
vertical-align: middle;
}
.z{
width: 100px;
height: 100px;
}
```
3.使用margin计算盒子的上下边距，使盒子居中
```
.f{
width: 200px;
height: 200px;
}
.z{
width: 100px;
height: 100px；
margin-top: 50px;
}
```
