logo
  • 教程列表
  • SO官方文档
  • 定心
    • 使用 Flexbox
    • 使用 CSS 转换
    • 使用 margin 0 auto
    • 使用 text-align
    • 使用绝对位置
    • 使用 calc()
    • 使用 3 行代码垂直对齐任何内容
    • 使用行高
    • 鬼元素技术(Micha Czernows hack)
    • 以另一个项目为中心
    • 垂直对齐 div 内的图像
    • 垂直和水平居中,无需担心高度或宽度
    • 以固定尺寸居中
    • 垂直对齐动态高度元素
    • 使用表格布局进行水平和垂直居中
  1. StackOverflow 文档
  2. CSS 教程
  3. 定心
  4. 使用行高

使用行高

Created: November-22, 2018

你还可以使用 line-height 垂直居中容器内的单行文本:

CSS

div {
    height: 200px;
    line-height: 200px;
}

这很难看,但在 <input /> 元素中可能很有用。line-height 属性仅在要居中的文本跨越一行时有效。如果文本换行为多行,则结果输出将不会居中。

  • 鬼元素技术(Micha Czernows hack)
  • 使用 3 行代码垂直对齐任何内容

Copyright © 2018. All right reserved

tastones.com 备案号:鲁ICP备18045372号-1

  • 关于我们
  • 免责声明