【问题标题】:Text not vertically centered in line文本不在行中垂直居中
【发布时间】:2016-10-06 16:35:26
【问题描述】:

下面的文字似乎比上面有更多的空间。

如何用 CSS 解决这个问题?

【问题讨论】:

  • 你试过行高吗?发布相关的 html css 代码你到目前为止所尝试的
  • 如果文本是 20px 并且容器(一个 div 或类似的东西)被强制为 30(例如)它将默认对齐到左上角。可能导致这种情况的其他属性是填充或边距。检查您的文本是否没有填充或边距
  • 你不能。它在您使用的字体中。根据您想要实现的目标,您可以向元素添加一个 padding-top。
  • 包含足够的代码以允许其他人重现该问题。如需帮助,请阅读How to create a Minimal, Complete, and Verifiable example
  • 代码在哪里?

标签: css alignment


【解决方案1】:

确保您的文本中有no specific padding/ margin。然后,给文本一个proper line-height,直到它垂直居中。您可以尝试google's developer tool(右键单击元素并检查元素或直接按 F12 )检查正确的行高。

【讨论】:

  • 感谢您的回答。但这就是我正在做的。从截图可以看出,高亮框不包括 padding(绿色)和 margin(橙色)
  • @ThịnhPhạm 你试过调整line-height 吗?
  • 我做到了。文本上方和下方的空间不相等。我觉得是字体问题。不是css
  • F12 仅适用于 Windows afaik。在 Mac 上是 CMD-ALT-i。
猜你喜欢
  • 2013-10-15
  • 2023-01-09
  • 2015-09-16
  • 2015-09-10
  • 2015-03-21
  • 2012-09-17
  • 2013-02-01
相关资源
最近更新 更多