inline-block 垂直居中布局（登陆框）

最新推荐文章于 2024-09-07 17:40:45 发布

黎成诃月

最新推荐文章于 2024-09-07 17:40:45 发布

阅读量2.9k

点赞数

分类专栏：前端-css

本文链接：https://blog.csdn.net/weixin_40292626/article/details/81483810

版权

前端-css 专栏收录该内容

18 篇文章 1 订阅

订阅专栏

<div class="box">
    <div class="inner">123</div>
</div>

.box{
    width: 600px;
    height: 600px;
    border: 1px solid #ccc;
    text-align: center;
}
.inner{
    width: 200px;
    height: 200px;
    background: #902000;
    display: inline-block;
    vertical-align: middle;
}
.box:after{
    content: '';
    display: inline-block;
    width: 0;
    height: 100%;
    vertical-align: middle;
}