如何在div内垂直居中文本？

如何垂直对齐 Div 中的文本

使用 div 时，有时需要确保其中的文本对齐垂直地在中间。这可以通过多种方法来实现。

使用line-height

如果div有固定的高度，比如50px，则可以简单地使用line-height CSS 属性。

#abc {
  height: 50px;
  line-height: 50px;
}

这将使文本在div.

使用显示属性

对于多行文本，您可以将其包装在 span 元素中并应用显示属性和垂直对齐。

#abc {
  display: table;
  width: 100%;
}

#abc span {
  display: table-cell;
  vertical-align: middle;
}

使用变换属性

另一种方法涉及将transform属性与translateY()函数结合使用。这对于不支持显示属性的旧浏览器特别有用。

#abc {
  position: relative;
}

#abc p {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}

以上是如何在div内垂直居中文本？的详细内容。更多信息请关注PHP中文网其他相关文章！