知识点
justify-content: center//子项在flex容器水平居中
align-items: center//子项在flex容器垂直居中
代码块
<div class="main">
<div class="maincon">
</div>
</div>
.main{
width: 100vw;
height: 100vh;
display: flex;
align-items: center;
justify-content: center;
}
.maincon{
width:400px;
height:200px;
background: #314057;
}