2

我对 HTML 电子邮件及其在 Outlook 2007 和 2010 中的呈现方式有疑问。

此代码片段中有 2 个部分导致我出现问题。

    <ul style="margin-left:-30px">
        <li style="list-style-image:url(images/blue_bullet.png); padding-bottom:7px;">Bullet 1</li>
        <li style="list-style-image:url(images/blue_bullet.png); padding-bottom:7px;">Bullet 2</li>
        <li style="list-style-image:url(images/blue_bullet.png); padding-bottom:7px;">Bullet 3</li>
    </ul>

我已经查看了此链接http://www.campaignmonitor.com/css/

它说这与 andpadding不兼容，但没有提到缺乏对. 在's之间添加一些空格的最佳方法是什么？divp'lili

同样对于列表样式图像，这也不会呈现，在hotmail中它只是呈现为普通光盘，这对我来说是可以的，但展望它什么都不是。我可以使用list-style-type:square;但让它变大变蓝吗？

4

2 回答 2

2

这是在 html 电子邮件中处理列表的最安全、最一致的方式。我知道更多代码，但它会在所有主要客户端上完美呈现。

<table width="600" border="0" cellpadding="0" cellspacing="0">
  <tr>
    <td width="30" valign="top">&bull;
    </td>
    <td valign="top" height="30">List Item 1
    </td>
  </tr>
  <tr>
    <td width="30" valign="top">&bull;
    </td>
    <td valign="top" height="30">List Item 2
    </td>
  </tr>
  <tr>
    <td width="30" valign="top">&bull;
    </td>
    <td valign="top" height="30">List Item 3
    </td>
  </tr>
</table>

它们位于单独的&bull;表格单元格中，因此如果您有一个多行列表项，则项目符号和“填充”保持在正确的位置。如果您想要不同的项目符号类型，只需在 ascii 表中找到一个字符来代替&bull;. 你也可以使用图片...

于 2013-09-12T20:16:29.670 回答
0

如果您正在制作电子邮件并且希望它们在所有电子邮件客户端上工作，请使用表格并设置宽度 - 如果您想让它具有响应性，那就是另一回事了，并且只适用于大多数电子邮件客户端。

对于这个例子，John 给出了正确和最准确的答案——但是如果你正在制作 html 电子邮件，那么请确保你将任何网页设计心态留在家里，因为它会阻碍你假设大多数事情都会以同样的方式工作。电子邮件是另一个世界的人。祝你好运！

于 2015-10-15T11:14:56.647 回答