检测布局在<pre> tag and visualize</pre>内强制执行换行符

时间:2012-10-14 16:17:10

标签: php javascript html css

是否有一种简单的方法可以检测pre标记内宽度限制导致的换行并使用像素图将其可视化? (即jsphp中可以执行该操作的小型库)

以示例(期望的结果):

+---------------------+
|sh foobar -xq blurb ↓|
|          →-stat /tmp|
|                     |
|                     |
|                     |
|                     |
+---------------------+

注意表示由于宽度限制导致的换行符。

注意:我不是在寻找语法高亮库,因为我通常只会写一些非常简短的片段,配置文件或bash命令。

1 个答案:

答案 0 :(得分:1)

您使用的是固定宽度的字体吗?如果是这样,您可以计算一行中适合的字符数,如果给定的行长于该行,则返回字符直到您点击一个空格,然后将其拆分。

即使布局灵活,您也可以计算当前可以容纳的字符数:创建一个具有相同字体的隐藏<div>,并为其添加字符,直到其高度增加。