css - 如何使我的文本在垂直和水平方向上都显示在该 DIV 的中心?

标签 css

<分区>

我需要将文本垂直和水平居中。对于以下代码,是否有一种简单的方法可以做到这一点?

<div style="display: block; height: 25px;">
    <span id="ctl_txt" style="background-color: rgb(255, 0, 0);">
        Basic
    </span>
</div>

最佳答案

您可以使用 text-align 属性使文本水平居中,line-height 等于 div 高度以使内联元素垂直居中。

<div style="display: block; height: 25px; text-align:center; line-height:25px;">
    <span id="ctl_txt" style="background-color: rgb(255, 0, 0);">Basic</span>
</div>

Example here .

关于css - 如何使我的文本在垂直和水平方向上都显示在该 DIV 的中心?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7453868/

相关文章:

css - 绝对定位 block 元素使其与其兄弟元素对齐

css 网格 - 元素的可变跨度

css - 字体内的图标是否适合网站?

Javascript 不会在浏览器中显示

html - 将一个 div 覆盖在另一个 div 上,没有空格

html - 如何在 Gitlab 中删除 p 标签的 auto ="dir"?

CSS 选择器效率

javascript - 为什么这个用于在 jQuery 中切换动画的三元运算符不起作用?

html - 中间垂直对齐行内 block 的没有设置高度

html - 网站视口(viewport)在 Bootstrap 4 上的 Safari 浏览器上仍然可以缩放和捏合