css3可以实现垂直文本溢出吗？

Question

要将省略号添加到太长的句子中,您可以使用此方法:http: //jsfiddle.net/ArKeu/

这适用于宽度,但它是否可以在某种程度上垂直添加省略号？这似乎不起作用:(

http://jsfiddle.net/ArKeu/2/

有谁知道这个,谢谢.

Answer 1

目前,没有跨浏览器的CSS方法来实现此类行为.

您现在只能在基于webkit的浏览器中使用-webkit-box和执行此操作-webkit-line-clamp,请参阅http://jsfiddle.net/ArKeu/7/

Answer 2

UPDATE!UPDATE!UPDATE!

从我写这个答案的那一刻起,Clamp.js似乎已经冷静下来并且死了.该项目仍然存在于github上,因此您可以查看它.

但是,这里有一个更好的选择:ftellipsis.它是跨浏览器.

为什么webkit浏览器应该有所有乐趣？

此处的解决方案更加广泛,并且还为其他浏览器提供支持. http://reusablebits.com/post/2642059628/introducing-clamp-js (死链接)

Answer 3

CSS 溢出模块级别 4是一项 W3C 规范，截至 2023 年 5 月 8 日，处于工作草案状态。

它定义了一个名为的 CSS 属性line-clamp，可以实现您的目标。它基于早期的 Webkit 属性，在 kizu 的回答中提到；因此，不断发展的规范在大多数带有-webkit-前缀的浏览器中仍然可用。

随着 CSS Overflow Module Level 4 规范的进展，我将更新这个答案。