SOURCE

<div id="wrapper">
    <div id="cell">
        <p>测试垂直居中效果测试垂直居中效果<br>测试垂直居中效果测试垂直居中效果</p>
    </div>
</div>

    html,
    body {
        /*height: 100%;*/
    }

    #wrapper {
        background: pink;
        color: black;
        height: 200px;/*如果改成%，则第一行代码不能注释*/
    }

    #cell {
        position: relative;        /*必须*/
        top: 50%;        /*必须*/
        transform: translateY(-50%);        /*必须*/
    }