<div class="parent"> <div class="children">我是通过flex的水平垂直居中噢！</div> </div>
html,body{ width: 100%; height: 200px; } .parent { display:flex; align-items: center;/*垂直居中*/ justify-content: center;/*水平居中*/ width:100%; height:100%; background-color:red; } .children { background-color:blue; }
原文：http://www.cnblogs.com/zhangwei595806165/p/5724761.html