.CSS.防止文本中的行仅包含一个单词

CSS. prevent line in text to only contain one word

本文关键字：包含一 单词 文本 CSS      更新时间：2023-09-26

快速提问，

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

你能不能强迫它至少有两个词？

不幸的是，

这在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/

你不能。这不属于 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];

问候。

相关文章：