如何在单词被包裹时跟踪行数？

Question

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

Answer 1

如何使用overflow: hidden?

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

4 lines * 16px = 64px

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

这就是你要追求的吗？

Answer 2

1）您可以测量服务器上文本的大小并且相当准确。我在Windows机器上用GDI +完成了这个;不确定您有权访问哪些操作系统或库。

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

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