html - 如何使我的文本在 DIV 中垂直对齐？

<分区>

我有这个代码:

<div style="font-size: 1.5rem; width: 20%;vertical-align: middle;" >ABC</div>

当我查看页面时，它显示如下。我添加了 x 来显示 DIV 的边界:

xxxxxxxxxxxxxxx
x             x
x ABC         x
x             x
x             x
xxxxxxxxxxxxxxx

垂直对齐似乎没有做任何事情。

有没有办法让ABC上下的空间一样。我看到了 CSS 表格和 Flex。有什么方法可以使用标准 CSS 来完成，还是我需要使用 CSS 表格或 Flex 之类的东西？

最佳答案

用于 display 像这样的属性

display:table-cell;

<div style="font-size: 1.5rem;border:solid 1px red; height:100px; width: 20%;display:table-cell;vertical-align: middle;" >abc</div>

关于html - 如何使我的文本在 DIV 中垂直对齐？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/33541993/