6

所以我试图结合word-breakwhichtext-overflow在某些时候确实有效，但不是它应该如何。

例如，我已经设置了这个Fiddle

CSS：

width: 200px;
padding: 8px;
border:1px solid blue;
word-break: break-word;
height: 100px;
overflow: hidden;
text-overflow:ellipsis;
white-space:nowrap;

为了澄清起见，一旦文本被分成几部分，它应该填满方框，并且在文本的末尾应该有 3 个点。目前只有一条线可以工作。

4

1 回答 1

3

据我所知，使用 CSS 是不可能的。

您唯一能做的就是指定height, 和overflow:hidden. （最后没有省略号。）

这在text-overflow 的 W3 规范中有所说明。

ellipsis
在发生文本溢出的每个框边界处插入一个省略号字符串。这些省略号字符串的值由“文本溢出省略号”属性确定。插入发生在一行文本的最后一个完整字形表示的边界处
……
换句话说，文本溢出模式仅影响参与其自身内联流的块元素的文本内容。

您将需要使用 JavaScript 来实现这一点。

这是一个 jQuery 插件的示例：http: //pvdspek.github.com/jquery.autoellipsis/

于 2012-12-15T19:02:50.720 回答