用省略号截断字符串

以下所有内容都是必需的，因此文本必须在一条直线上，该直线溢出一个隐藏了该溢出的框。

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

见笔基本溢出省略号克里斯Coyier（ @chriscoyier上） CodePen 。

注意此处使用的固定宽度。 要点是，元素需要某种确定的宽度，使用flexbox时必须格外小心：

在CodePen上查看 Chris Coyier （ @chriscoyier ） 了解的关于flexbox的Pen Thing 。

---

寻找截断到特定数量的行？

翻译自: https://css-tricks.com/snippets/css/truncate-string-with-ellipsis/