我正在使用 Foundation For Email 响应式电子邮件内联 V2,可在以下位置找到: http://foundation.zurb.com/emails/inliner-v2.html
我的 TWIG 代码有问题:
<table class="row collapse">
<tbody>
<tr>
{% for alternative in alternatives %}
<th class="small-6 large-4 columns">
<table>
<tr>
{{ alternative.name }}
</tr>
</table>
</th>
{% endfor %}
</tr>
</tbody>
</table>
成为
{% for alternative in alternatives %} {% endfor %}
<table class="row collapse" style="border-collapse: collapse; border-spacing: 0; display: table; padding: 0; position: relative; text-align: left; vertical-align: top; width: 100%;">
<tbody>
<tr style="padding: 0; text-align: left; vertical-align: top;">
<th class="small-6 large-4 columns" style="Margin: 0 auto; color: #0a0a0a; font-family: Helvetica, Arial, sans-serif; font-size: 16px; font-weight: normal; line-height: 1.3; margin: 0 auto; padding: 0; padding-bottom: 16px; padding-left: 0; padding-right: 0; text-align: left; width: 193.33333px;">
{{ alternative.name }}
<table style="border-collapse: collapse; border-spacing: 0; padding: 0; text-align: left; vertical-align: top; width: 100%;">
<tbody>
<tr style="padding: 0; text-align: left; vertical-align: top;"></tr>
</tbody>
</table>
</th>
</tr>
</tbody>
</table>
如您所见,for-Construct位于table-Tag的顶部,因此在内联后它不会环绕在th-Tag周围。
有人知道该怎么做吗?让我发疯;)
首先,您的html代码格式不正确:
<table class="row collapse">
<tbody>
<tr>
{% for alternative in alternatives %}
<th class="small-6 large-4 columns">
<table>
<tr>
<!-- add here td or th tags -->
<td>
{{ alternative.name }}
</td>
</tr>
</table>
</th>
{% endfor %}
</tr>
</tbody>
</table>
它通常与代码中的一些错误有关:
您也可以使用原始版本:http://foundation.zurb.com/emails/inliner.html