<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="utf-8" />
<title>弹性盒子模型</title>
<meta name="author" content="suixinMLF" />
<style>
.centent{
width:300px;
height:200px;
border:1px solid #ebebeb;
display: -webkit-box;
display: -moz-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
align-items: center;
-webkit-justify-content:center;/*在主轴上对其的方向*/
justify-content:center;
-webkit-align-items:center;/*在交叉轴上的对其方式*/
box-sizing: border-box;
-webkit-box-pack: center;
-webkit-box-align: center;
}
.centent div{
padding:10px;
}
</style>
</head>
<body>
<div class="centent">
<div>让子元素垂直居中</div>
<div>让子元素垂直居中让子元素垂直居中让子元素垂直居中让子元素垂直居中</div>
</div>
</body>
</html>