多行文本溢出

Question

我需要修剪一些文字而不是它的长度，而是它的高度。我有这个：

<div style="width:100px; height:100px; overflow:hidden;">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus nec lacus at felis malesuada hendrerit. Pellentesque et leo venenatis nulla feugiat bibendum. Ut pretium porta massa, vitae interdum nulla ultrices et. Etiam ut erat id magna interdum consequat. Curabitur ornare sodales metus quis egestas. Donec odio est, hendrerit vel vehicula ut, scelerisque ac tortor. Curabitur risus neque, viverra vitae dapibus vitae, vulputate vitae est
</div>

此代码将显示隐藏溢出文本的正方形。我需要隐藏溢出的文本，但在可见文本的末尾，会显示省略号（“...”）。 使用text-overflow属性的问题是，它仅适用于world-wrap: none; - 只适用于一行文本。

Answer 1

我没有经过测试，但我认为这样可行：

    <div style="width:100px; height:100px; overflow:hidden;"> 

    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus nec lacus at felis malesuada hendrerit. Pellentesque et leo venenatis nulla feugiat bibendum. Ut pretium porta massa, vitae interdum nulla ultrices et. Etiam ut erat id magna interdum consequat. Curabitur ornare sodales metus quis egestas. Donec odio est, hendrerit vel vehicula ut, scelerisque ac tortor. Curabitur risus neque, viverra vitae dapibus vitae, vulputate vitae est 

    <div class="ellipsis">...</div>    
    </div>

.ellipsis
{
vertical-align: text-bottom;
float: right;
}

Answer 2

我开发了一个处理多行文本溢出的库

请查看http://www.samuelrossille.com/home/jstext以获取屏幕截图，教程和下载链接。