换行时如何跟踪行数？

【问题标题】：How to track lines count when words are wrapped?换行时如何跟踪行数？
【发布时间】：2010-10-16 03:47:15
【问题描述】：

在不固定间距字体打印的 div 中输出文本。这个 div 高度只允许打印 4 行文本。是否可以跟踪自动浏览器自动换行，以便我可以在文本中找到位置，当它达到 4 行并删除下一行？使用 Javascript 操作 DOM 或使用 PHP 帮助计算文本行长度的任何建议？

【问题讨论】：

【解决方案1】：

用overflow: hidden?怎么样

假设您的 font-size 为 12 像素，line-height 为 16 像素。

4 lines * 16px = 64px

.hide-extra-lines {
    height: 64px;
    overflow: hidden;
}

这就是你所追求的吗？

【讨论】：

【解决方案2】：

1) 您可以测量服务器上文本的大小并且相当准确。我已经在 Windows 机器上使用 GDI+ 完成了这项工作；不确定您可以访问哪些操作系统或库。

2) 您可以在客户端使用等宽字体，并根据容器的宽度和字长检测文本何时换行。然后，您可以截断文本。

3) 客户端不能使用等宽字体，仍然使用脚本进行猜测，并使用overflow: hidden 捕获任何溢出的文本。

【讨论】：