使用flex布局,设置其属性justify-content，align-items都为center，实现水平垂直居中

作者：管理员

发布时间：2020/8/8 22:43:46

评论数：0

转载请自觉注明原文：http://www.jq-school.com/Show.aspx?id=2340

父元素使用flex布局,并定义两个属性值justify-content，align-items都为center，那么就定义为水平垂直居中

justify-content属性定义了项目在主轴上的对齐方式。align-items属性定义项目在交叉轴上如何对齐。

<div class="parent-frame" style="display: flex; justify-content: center; align-items: center">
 
 <div class="child-frame">使用flex布局，justify-content属性定义了项目在主轴上的对齐方式。</div>
 
 <div class="child-frame">
 
 align-items属性定义项目在交叉轴上如何对齐。 两个属性都居中，则水平、垂直居中对齐
 
 </div>
 
</div>
web前端开发学习Q-q-u-n：784783012 ，分享学习的方法和需要注意的小细节

使用flex布局，justify-content属性定义了项目在主轴上的对齐方式。 align-items属性定义项目在交叉轴上如何对齐。 两个属性都居中，则水平、垂直居中对齐

关键字：css