删除 HTML 电子邮件中 <pre> 标记内的空格答案

【问题标题】：Removing Whitespace inside a <pre> Tag in an HTML E-Mail删除 HTML 电子邮件中 <pre> 标记内的空格
【发布时间】：2016-09-14 15:38:10
【问题描述】：

我有一个使用velocity 生成HTML 电子邮件的应用程序。一个表达式生成我无法控制的输出（它来自 Jira 插件）：

<table border="0" cellpadding="0" cellspacing="0" width="100%">
    <tr>
    <td valign="top">
          <pre>#changesIncludingStatus([])</pre>
         </td>
    </tr>
</table>

输出包含换行符，但没有换行符。我正在尝试使用 pre.xml 解决此问题。但由于某种原因，这些行也用空格标识，这在 HTML 电子邮件中看起来很奇怪。

<pre><div class="aptis-pre">            Bearbeiter: Vorgesetzter Mitarbeiter  (war: Administrator)
    Resturlaub: 23
    Beschreibung:
</div></pre>

导致 a strange display

有什么办法可以去掉每行开头的空格？

【问题讨论】：

缩进是由于
```
 标签
```
只需从上面的代码中删除空格。
我正在寻找一种方法让换行符像中断一样显示，但没有标识
我无法删除空格，我无法控制占位符生成的输出#changesIncludingStatus([])
你为什么不用 JavaScript 或 jquery 来做呢？你要我提供 jquery 代码吗？

标签： html css email

【解决方案1】：

如果我理解正确，您想要做的是保留换行符但折叠空格。

有一个 CSS 属性可以控制这种行为：white-space。如果设置为pre-line，它将完全执行此操作，来自MDN：

前行：空格序列被折叠。在换行符、<br> 处换行，并根据需要填充行框。

.aptis-pre
{
  white-space: pre-line;
}

<div class="aptis-pre">            Bearbeiter: Vorgesetzter Mitarbeiter  (war: Administrator)
    Resturlaub: 23
    Beschreibung:
</div>

请注意，由于您直接控制 white-space，因此您不需要将该 sn-p 包装到 <pre>（将 white-space 设置为 pre 并保留空格）。

【讨论】：

【解决方案2】：

只需从您的 HTML 中删除 space。如下格式化您的代码。

<pre><div class="aptis-pre">            Bearbeiter: Vorgesetzter Mitarbeiter  (war: Administrator)
    Resturlaub: 23
    Beschreibung:
</div></pre>

<hr>

<pre><div class="aptis-pre">Bearbeiter: Vorgesetzter Mitarbeiter  (war: Administrator)
Resturlaub: 23
Beschreibung:
</div></pre>

【讨论】：

我不能那样做，我不能修改占位符的输出

【解决方案3】：

我找到了一种替代方法，但无法完全发挥作用：

#set ($changes = "#changesIncludingStatus([])")
#set ($changes = $changes.replace("\\n","<br/>"))
$changes

我无法获得速度来替换中断，但我会采用基于“空白：前线；”的解决方案阿德里亚诺·雷佩蒂（Adriano Repetti）

对不起，它没有完全解决，但也许它会帮助别人。

【讨论】：

请注意，当字符串被复制到 HTML 中时，它也会被转义，并且
将变为 <br/> （没有效果）。要完成这项工作，您应该首先手动转义，进行替换，然后按原样插入文本（无需进一步转义）。相反（我不知道 velocity）如果没有完成转义（我怀疑），那么不要忘记这样做，否则您可能会产生损坏的 HTML 电子邮件。