如何在段落中的某些单词之后生成“...”。 Javascript [重复]答案

【问题标题】：how to generate "..." after certain words in a paragraph. Javascript [duplicate]如何在段落中的某些单词之后生成“...”。 Javascript [重复]
【发布时间】：2016-03-18 05:57:56
【问题描述】：

我有一个很长的段落，但我只想展示其中的一部分。是否可以在某些单词之后生成“...”。

例如，这是我的段落。

 <div class="paragraph">
 <p>Lore gypsum dolor sit met, con sec tetuer dip icings lite. Aeneid commodore ligula beget dolor. Aeneid mas- s. Cum socialist toque Pentiums lit something something</p>
 </div>

我想在页面中显示“Lore gypsum dolor sit me ....”

【问题讨论】：

你可以使用 CSS 的 text-overflow 属性。
stackoverflow.com/a/1022672/5305938

标签： javascript html css

【解决方案1】：

试试text-overflow: ellipsis;

.paragraph{
 white-space: nowrap; 
width: 120px; 
overflow: hidden;
text-overflow: ellipsis;
}

【讨论】：

当你想指定一定数量的单词时，这将不起作用..
您可以将宽度应用于您的课程，这将解决您的问题
要处理评论，当您想指定多个单词时，这将不起作用。如果你指定一个width，它会，但如果对单词有硬性要求（不管多么愚蠢），你就不走运了（使用CSS）。值得一提的是，对于等宽字体，您可以使用ch 单位，这将允许您在一定数量的字符之后插入省略号。

【解决方案2】：

你可以试试这个：

.paragraph {
    white-space: nowrap;
    overflow: hidden;
}

DEMO HERE

【讨论】：