HTML电子邮件中的标签内联列表

Question

我正在尝试创建一个HTML新闻稿模板,该模板将在该电子邮件中的某个位置显示标签列表.该列表的元素数量是动态的.例如,我想用这些标签设置每个标签周围的边框,而不是使用逗号/空格分隔的列表.

格式化为表可能不起作用,因为为每个标记生成一个表将创建一个太宽的表,无法在其父表中正确显示.另一方面,生成一个将不会产生内联列表.

我想要使​​用他们的css设置来显示:inline; 或一组显示:内联; 以及:

<span class="hashtag-span">#hashtag</span>
<span class="hashtag-span">#anotherone</span>

或者

<ul class="hashtag-list">
    <li>#hashtag</li>
    <li>#anotherone</li>
</ul>

可能是最棘手的部分:这必须与Outlook兼容:(

你可以在我的jsfiddle中看到我想要的东西:http: //jsfiddle.net/wo64xLnf/3/

谢谢你的帮助,人群!

Answer 1

Phillyoo、Outlook 不呈现“显示”样式属性。即使上面的代码有效，它也无法在 Outlook 中正确呈现。

查看https://www.campaignmonitor.com/css/ - 这是设计电子邮件的良好指南。

您应该能够通过使用表、行和 td 来实现您想要的目标。使用内联样式并将“align =“left””应用于嵌套的td。

例子：

  <table width="100%">
        <tr>
            <td>
                <table>
                    <tr>
                        <td align="left" style="">#hashtag</td>
                    </tr>
                </table>
                <table>
                    <tr>
                        <td align="left" style="">#hashtag</td>
                    </tr>
                </table>
            </td>
        </tr>
    </table>

您还可以尝试将 TD 标签放在同一个嵌套表中，看看它对您有何作用。

最好的