flex布局控制子元素水平垂直居中

Song285 次浏览0个评论2022年01月21日
flex布局控制子元素水平垂直居中


<div class="box">
    <i class="iconfont test"></i>
    <font>点击菜单</font>
</div>

我们通过CSS控制

.box {
    display: flex;
    justify-content: center; /* 水平居中 */
    align-items: center;     /* 垂直居中 */
    width: 1000px;
    height: 600px;
    border: 1px solid red;
}
.inner {
    width: 300px;
    height: 200px;
    background-color: red;
}

提交评论

请登录后评论

用户评论

    当前暂无评价,快来发表您的观点吧...

更多相关好文