CSS。防止文本中的行只包含一个单词

Question

快速提问，

无法为此找到任何好的解决方案。在一个网站上我有很多段落。它的响应有时使文本中的最后一行只有一个单词。

你可以强迫它至少有两个单词吗？

Answer 1

不幸的是，CSS无法实现。但是，您可以使用更简单的解决方案，只需用 替换单词之间的最后一个空格（最好的方法是使用像PHP这样的服务器端语言，但您也可以使用Javascript）。

示例：

<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna&nbsp;aliqua.</p>

http://jsfiddle.net/h1bhuexL/

Answer 2

你做不到。这不属于CSS的管辖范围，因为它无法检测子串。这可以是JS的工作，也可以是预处理器（PHP等）。

如果您知道CSS的具体宽度：

element { width: 250px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis }

在JS中，只需将行与' '（空格）分开，并仅显示它创建的数组的第一个条目。

var str = "How are you doing today?";
var res = str.split(" ");
document.getElementById("demo").innerHTML = res[0];

问候。