在多行 div 中隐藏部分溢出的文本？

Question

如何删除或隐藏部分溢出的文本行？例子：

网页：

<div>Lot of interesting text in this multi-line box but how do I remove or hide the last line</div>

CSS：

div {
    border: 1px solid black;
    height:65px;
    width:150px;
    overflow:hidden;
}

https://jsfiddle.net/7mudnnco/

编辑：我想要的结果的图像：

Edit2：这个类似的问题有一个几乎可行的解决方案，但我正在寻找一种解决方案，当没有行完全可见时，所有行都被隐藏。一个几乎有效的解决方案：http://jsfiddle.net/4Fpq2/9/（将高度更改为 15px 以查看为什么它不能完全工作）

Answer 1

如果字体大小和框大小已知，您可以简单地设计框，使其恰好包含 3 行文本，一种方法是：

div {
    border: 1px solid black;
    height:65px;
    width:150px;
    overflow:hidden;
    line-height: 22px;   
}