垂直居中

1.不知道自己高度和父容器高度的情况下, 利用绝对定位只需要以下三行:

    <style>
       .container{
           position: relative;
       }
       .context{
           position: absolute;
           top: 50%;
           transform: translateY(-50%);
       } 
    </style>
    <div class="container">
        <div class="context">
        </div>
    </div>

2.flex

arentElement{
    display:flex;/*Flex布局*/
    display: -webkit-flex; /* Safari */
    align-items:center;/*指定垂直居中*/
}
原文地址:https://www.cnblogs.com/zzzzzzzsy/p/8910922.html