没有“white-space：nowrap”的文本溢出省略号 [英] text-overflow ellipsis without "white-space: nowrap"?

问题描述

我想知道是否有任何聪明的方式，实现css 省略号效果，而不需要应用 white-space：nowrap 。

I was wondering if there is any clever way, to achieve the css ellipsis effect without the need to apply white-space: nowrap also.

换句话说，假设我们有一个具有一定高度的块元素，我们想让它填满但是水平 加 垂直中没有更多空间时，应立即应用省略号

In other words, lets say we have a block element of a certain height and we'd like to let it get filled up with text-content, but the ellipsis should get applied as soon as there is no more room in horizontal plus vertical directions.

快速示例： http://jsfiddle.net/fpv9n/2 /

文字应该是这样，但最后还有一个省略号。任何方式实现使用CSS？我会考虑JS解决方案。

Text should be like it is, but also with an ellipsis at the end. Any way to achieve that using CSS ? I would take JS solutions also into consideration.

推荐答案

没有办法使用纯CSS。它是怪异和悲伤。我经常想要这个自己，当你想让浏览器省略多行文本，可能溢出的文本，当它溢出的容器。

There is no way to do this using pure CSS. It's monstrous and sad. I've often desired this myself when you want the browser to "ellipsify" a multi-line text with possibly overflowing text whenever it spills out of the container.

这篇关于没有“white-space：nowrap”的文本溢出省略号的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！