table让元素垂直居中的布局⼩技巧
通过给⽗元素设置display：table，然后给⼦元素设置display:table-cell,vertical-align:middle可以实现⼦元素的内容⽔平垂直居中，下⾯代码实例：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style type="text/css" rel="stylesheet">
.table {html怎么让所有内容居中
display: table;
margin: 5px;
width: 500px;
height: 300px;
background-color: #ccc;
}
.cell {
display: table-cell;
padding: 10px;
vertical-align: middle;/*该属性是定义⾏内元素垂直对齐的，只有⾏内元素会⽣效。在表单元格中，这个属性会设置单元格框中的单元格内容的对齐⽅式。*/
}
</style>
</head>
<body>
<div class="table">
<div class="cell">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Autem dicta eligendi eum, expedita illum laboriosam laborum magni minima minus necessitatibus nihil numquam optio, quas quo repudiandae saepe similique? Corporis, mollitia.</div>
</div>
</body>
</html>

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。