手记

让文本相对父元素垂直居中

<!DOCTYPE HTML>
<html>
<head>
<meta  charset="utf-8">
<title>20170615</title>
<style>
.container{
    height:400px;
    background:#999;
    display:table-cell;/*IE8以上及Chrome、Firefox*/
    vertical-align:middle;/*IE8以上及Chrome、Firefox*/
}
 .wrap{height:400px;background:#ccc}
</style>
</head>

<body>
<div class="container">
    <div>
        <p>看我是否可以居中。</p>
        <p>看我是否可以居中。</p>
        <p>看我是否可以居中。</p>
        <p>看我是否可以居中。</p>
        <p>看我是否可以居中。</p>
    </div>
</div>

<table><tbody><tr><td class="wrap">
<div>
    <p>看我是否可以居中。</p>
    <p>看我是否可以居中。</p>
    <p>看我是否可以居中。</p>
    <p>看我是否可以居中。</p>
    <p>看我是否可以居中。</p>
</div>
</td></tr></tbody></table>
</body>
</html>
0人推荐
随时随地看视频
慕课网APP