内联元素在块级元素内部垂直水平居中

最新推荐文章于 2022-01-02 21:52:17 发布

侠之大者为国为民

最新推荐文章于 2022-01-02 21:52:17 发布

阅读量1.8k

点赞数

分类专栏： css 文章标签： html css

css 专栏收录该内容

6 篇文章 1 订阅

订阅专栏

<html>

<head>
    <style>
        *{margin:0;padding:0}
        .box {
            position: absolute;
            width:100%;
            height:100%;
            background-color:gray;
            text-align: center;
        }
        .middle{
            padding:3px;
            background-color: orange;
        }
        .box:after{
            display:inline-block;
            height:100%;
            content:'';
            vertical-align: middle;
        }
    </style>
</head>

<body>
    <div class="box">
    <span class="middle">行内元素</span>
    </div>
</body>

</html>

优惠劵

侠之大者为国为民

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
1
评论
内联元素在块级元素内部垂直水平居中

*{margin:0;padding:0} .box { width:400px; height:200px; background-color:gray; text-align: center; } .middle{ paddin
复制链接

扫一扫