Question

我在HTML white-space: pre-wrap元素上使用<pre>样式，以允许行在浏览器窗口较宽时断开。

不幸的是，那些断线也看起来像，好像它们最后有一个换行符;用户无法看到它是否是自动换行符。

有没有办法在行的末尾显示正在进行换行（正如emacs对\字符所做的那样），或者在换行的开头显示它们是前一个的延续行（例如→）？

复制＆amp;粘贴不应复制延续字符。

<pre style="white-space: pre-wrap">for i in range(19): selwidth=5; selheight=1000; image = gimp.image_list()[0];posx=initx+i*90; pdb.gimp_image_select_polygon(image, 2, 8, [posx, 0, posx+selwidth, 0, posx+selwidth-selheight, selheight, posx-selheight, selheight]);</pre >

首选渲染，在延续行的开头加→：

for i in range(19): selwidth=5; selheight=1000; image = gimp.image_list()[0];posx=
→initx+i*90; pdb.gimp_image_select_polygon(image, 2, 8, [posx, 0, posx+selwidth, 0, 
→posx+selwidth-selheight, selheight, posx-selheight, selheight]);

Answer 1

预旨在保留输入的文字。它有助于保留诗歌和专业文本，因为它们有意被浏览，而不是由浏览器格式化。我想大多数人都能用一个空格来判断一行文本是否包含在Pre中：pre-wrap因为它看起来像这样：五只小猴子跳上 bed，{{line break}} 一个人跌倒了，撞到了他的头。 {{越线}} 妈妈叫医生和医生医生说，{{line break}} “没有更多的猴子跳到床上了！'{{line break}}

如果您使用直接HTML <p>，那么它看起来就像您在示例中键入它一样，<pre>使用空格：在您键入内容时，预包装会查看空格。

要为每行的两端着色，您可以尝试放置<span>并将CSS赋予颜色和大小，或者在整个句子上执行<span>，为其提供CSS背景色。

Answer 2

AFAIK不使用CSS，而是可以用2个换行符替换每个换行符，以便在文本换行时区分换行符，或者手动输入两个 - 或更多 - 换行符{{1对于每个新行，或者如果你可以使用javascript，那么你可以替换每个分号; - ，因为问题中提供的示例是每行以 {结尾的代码{1}} - 将其替换为; - 或替换为;\n\n - 因此会被识别。

JS Fiddle

＆＃13;

;<br><br>

＆＃13;

var pre = document.getElementsByTagName('pre')[0],
  preHTML = pre.innerHTML;

pre.innerHTML = preHTML.replace(/;\s*/g, ";\n\n");

＆＃13;

表示空白区域中的自动换行：预换元素

2 个答案: