to add ellipsis to a sentence that is too long you can use this method: http://jsfiddle.net/ArKeu/
要为太长的句子添加省略号,可以使用以下方法:http://jsfiddle.net/ArKeu/
that works great for widths but is it somehow possible to add ellipsis vertically too? that doesn't seem to work :(
这对宽度很有效,但是是否可以在垂直方向上添加省略号呢?那似乎不管用:
http://jsfiddle.net/ArKeu/2/
does anyone know this, Thanks.
有人知道吗,谢谢。
2 个解决方案
#1
31
Currently there is no cross-browser CSS-only way to achieve such behavior.
目前没有跨浏览器的CSS-only方法来实现这种行为。
You can do this now only in webkit-based browsers by using the -webkit-box
and -webkit-line-clamp
, see http://jsfiddle.net/ArKeu/7/
现在只能在基于webkit的浏览器中使用-webkit-box和-webkit-line-clamp,请参见http://jsfiddle.net/ArKeu/7/
#2
10
UPDATE! UPDATE! UPDATE!
更新!更新!更新!
Since the time when I wrote that answer, Clamp.js seems to have cooled-off and died. The project still exists on github so you can check it out.
从我写下答案的时候起,夹住。js似乎已经冻死了。这个项目还在github上,所以你可以去看看。
But, there is a better alternative here: ftellipsis. It is cross-browser.
但是,这里有一个更好的选择:ft省略号。它是跨浏览器。
Why should webkit browsers have all the fun?
为什么webkit浏览器会这么有趣?
This solution here is much more extensive, and provides support for other browsers as well. http://reusablebits.com/post/2642059628/introducing-clamp-js (dead link)
这里的解决方案更加广泛,也为其他浏览器提供了支持。http://reusablebits.com/post/2642059628/introducing-clamp-js(死链接)
#1
31
Currently there is no cross-browser CSS-only way to achieve such behavior.
目前没有跨浏览器的CSS-only方法来实现这种行为。
You can do this now only in webkit-based browsers by using the -webkit-box
and -webkit-line-clamp
, see http://jsfiddle.net/ArKeu/7/
现在只能在基于webkit的浏览器中使用-webkit-box和-webkit-line-clamp,请参见http://jsfiddle.net/ArKeu/7/
#2
10
UPDATE! UPDATE! UPDATE!
更新!更新!更新!
Since the time when I wrote that answer, Clamp.js seems to have cooled-off and died. The project still exists on github so you can check it out.
从我写下答案的时候起,夹住。js似乎已经冻死了。这个项目还在github上,所以你可以去看看。
But, there is a better alternative here: ftellipsis. It is cross-browser.
但是,这里有一个更好的选择:ft省略号。它是跨浏览器。
Why should webkit browsers have all the fun?
为什么webkit浏览器会这么有趣?
This solution here is much more extensive, and provides support for other browsers as well. http://reusablebits.com/post/2642059628/introducing-clamp-js (dead link)
这里的解决方案更加广泛,也为其他浏览器提供了支持。http://reusablebits.com/post/2642059628/introducing-clamp-js(死链接)