html-email – HTML电子邮件中的标签内联列表

我正在尝试创建一个 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/

谢谢你的帮助,人群!

解决方法

Phillyoo,Outlook不呈现’display’样式属性.即使上面的代码有效,它也无法在Outlook中正确呈现.

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

您应该能够通过使用表,行和标准来实现您期望的目标.使用内联样式并将’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标签,看看它是如何工作的.

最好

相关文章

vue阻止冒泡事件 阻止点击事件的执行 &lt;div @click=&a...
尝试过使用网友说的API接口获取 找到的都是失效了 暂时就使用...
后台我拿的数据是这样的格式: [ {id:1 , parentId: 0, name:...
JAVA下载文件防重复点击,防止多次下载请求,Cookie方式快速简...
Mip是什么意思以及作用有哪些