css - 文本换行的 CSS2 替代方案：无

Question

我有一个元素，我希望我的文本行永远不会中断，即使文本到达边界也不行。在那种情况下，我只是希望文本溢出，就像它只是一个长词一样。

经过一番研究，我发现 CSS3 属性 text-wrap 可以做到这一点。但是任何现代浏览器都不支持它。http://www.w3schools.com/cssref/css3_pr_text-wrap.asp

有没有我可以使用的替代方法。

Answer 1

尝试溢出和空白？他们有相当好的浏览器支持。

在 JSFiddle 上查看它们

#overflow {
  white-space: nowrap;
  overflow: visible;
}

作为对未来的建议，我建议不要使用 w3schools，因为他们的数据通常不完整，有时甚至是错误的。MDN 是一个更可靠的选择！

Answer 2

将代码包装在<pre>这意味着您的文本是预先格式化的，并且只有在您实际声明它时才会换行 DEMO http://jsfiddle.net/kevinPHPkevin/zcSFP/

<div>
    <pre><p>this is a long paragraph this is a long paragraph this is a long paragraph this is a long paragraph this is a long paragraph this is a long paragraph this is a long paragraph this is a long paragraph this is a long paragraph this is a long paragraph this is a long paragraph this is a long paragraph </p></pre>
</div>

Answer 3

这只是关于 CSS 规范的非常非常奇怪的事情之一。与您正在寻找的最接近的属性是word-wrap. 不幸的是，它没有不包装的价值，但white-space确实如此。尝试将此添加到您的元素中：

selector {
    white-space:nowrap; /* Sets no wrapping */
overflow:hidden; /* Hides the text that overflows the container. */
}

例如，您还可以使用 jmeas 的解决方案添加省略号。来源：http ://css-tricks.com/almanac/properties/w/whitespace/