CSS垂直居中

方法1：table-cell

 

.box1{
    display: table-cell;
    vertical-align: middle;
    text-align: center;       
}
 
<div class="box box1">
        <span>垂直居中</span>
</div>

 

 

  　

 

 

方法2：display:flex

.box2{

    display: flex;

    justify-content:center; //横

    align-items:Center;  //竖

}

 

 方法3：定位

.eleTag{
 
/*设置元素绝对定位*/
position:absolute;
top 50%; 
left: 50%;
/*css3 transform 实现*/
transform: translate(-50%, -50%);

}

 

来源：https://www.cnblogs.com/congxueda/p/12298499.html