html - 最大限度。文本行数；这种方法可靠吗？

Question

我需要限制一些文本，使其永远不会超过 2 行

这是我目前所拥有的:

<h3>Here is some long text, it just keeps on going and going and going.. Hello, how are you? I'm fine thank you. And yadda yadda yadda</h3>

h3 {
    width: 400px;
    font-size: 1.5em;
    max-height: 2.4em;
    line-height: 1.2em;
    overflow-y: hidden;
    /* perhaps throw in some padding and margin control to be sure */
}

参见 fiddle :http://jsfiddle.net/e5EKY/

它似乎可以工作，我已经在少数浏览器中测试过，效果不错

但我能指望这个吗？是否存在超过 2 行的情况？

如果用户在浏览器中放大或放大字体大小，最大高度和行高应该遵循 (em's)，所以我不认为这是一个问题

(PS:我需要使用 em，所以像素大小不是一个选项)

Answer 1

当然，您的方法会奏效，但只有一件事:如果您写下的单词超过 400px 宽度，那么它会水平溢出。要解决此问题，您只需将 word-wrap: break-word 和 white-space: pre 添加到 CSS 规则。