【问题标题】:Vertically center a title with fixed height in css在css中垂直居中具有固定高度的标题
【发布时间】:2010-09-22 20:43:36
【问题描述】:

我有一个标题

<h1>My Header</h1>

它的高度为150pxfont-size1.3em; 如何使标题文本与 CSS 垂直居中。 我宁愿不将它包装在容器 DIV 中(包装 div 真的会破坏整个 CSS 想法)。

【问题讨论】:

    标签: css vertical-alignment


    【解决方案1】:

    最好的方法是添加这条规则:

    h1 {
        line-height: 150px;
    }
    

    不需要设置高度值,字体大小不影响垂直对齐。

    【讨论】:

    • 字体大小确实会影响 .. 字体大小 ;)
    • 如果文本最终变成多行,这不是问题吗?
    【解决方案2】:

    如果标题的高度是150px,你能不能把line-height也设置成150px?

    h1
    {
        font-size: 1.3em;
        line-height: 150px;
        height: 150px;
    }
    

    【讨论】:

    • 感谢您的回答。正如 alexmeia 所指出的,似乎高度是不必要的,因为 line-height 已经拉伸了标签。
    猜你喜欢
    • 1970-01-01
    • 2017-10-13
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2015-08-05
    • 2019-08-28
    • 1970-01-01
    相关资源
    最近更新 更多