Question

我目前正在尝试制作一些通过电子邮件客户端（在这种情况下为SendGrid）发送的电子邮件模板。在对如何创建这些模板进行了一些研究之后，我得出结论，由于邮件客户端预处理器（主要是Gmail和Outlook），使用常规的 HTML 和 CSS ）删除几乎所有非内联样式的已应用样式。但是我仍然有一个问题。

使用EventDispatcher甚至在List-style-type:和每个UL标签上都没有内联，似乎无法摆脱要点。在使用电子邮件模板方面，有人对如何从LI或UL删除项目符号有经验吗？

Answer 1

您需要将list-style: none;设置为li元素以删除项目符号点。

要从UL中删除项目符号，您可以简单地使用list-style-type: none;或AMAZON.FallbackIntent如果仍然不起作用，那么我想这是优先级CSS的问题。可能在全球范围内已经定义了UL。因此，最好的方法是将类添加到该特定的UL并在其中添加CSS。希望它能工作。

Answer 2

您可以将 list-style-type：none; 添加到ol，ul标签并强行应用它，您可以添加'！important'

例如：列表样式类型：无！重要；

Answer 3

如果普通CSS无法正常工作，则可以尝试将空白的1x1透明图像设置为列表标记。

ul.a {
    list-style-image: url('data:image/gif;base64,R0lGODlhAQABAAAAACwAAAAAAQABAAA=');
}

Answer 4

您需要将list-style: none;与Outlook解决方案结合起来，以便有条件地将它们从视线中移开，如下所示：

将此内容放入您的<head>部分：

  <!--[if (gte mso 9)|(IE)]>
  <style type="text/css">
    li {
        text-indent: -3em;
    }
  </style>
  <![endif]-->

带有列表：

<ul style="margin:0;padding:0;list-style:none;">
  <li style="margin:0 0 16px 30px;padding:0;">content</li>
  <li style="margin:0 0 16px 30px;padding:0;">content</li>
</ul>

请注意，Outlook不遵守<ul>中的边距，而其他具有默认值，因此最好始终重置边距和填充，然后在<li>中应用边距（不填充）

电子邮件模板HTML从ul中删除项目符号点

4 个答案: