Question

有没有办法在两行显示文字，溢出是点缀？我可以用

white-space: nowrap;
text-overflow: ellipsis;

但它将文字显示在一行中。我需要在两行中显示我的文本，如果溢出文本则应该显示点缀结束。

Answer 1

在css设置width元素，white-space设置为pre

＆＃13;

div  {
  font-size: 1em;
  display: inline-block;
  width: 2em;
  white-space: pre;
  text-overflow: ellipsis;
  overflow: hidden;
}

＆＃13;

<div>lines of 
breaks</div>

＆＃13;

Answer 2

删除White-space属性并使用元素的高度

Answer 3

适用于Chrome，Safari和Opera的CSS解决方案是：

display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;

您可以将2更改为任意数字。它将在末尾显示X个文本和点数

并非所有浏览器都支持