Email Outlook和gmail电子邮件完全不同

我为我们的电子邮件营销培训做了一个模板。但在gmail上，msn（基于浏览器）是好的，但在outlook上是坏的。我怎样才能解决这个问题

我的一段代码：

<td valign="top" width="194" class="rightColumnContent">

                                                <!-- // Begin Module: Top Image with Content \\ -->
                                                 <table border="0" cellpadding="10" cellspacing="0" width="194px" height="194px" style="background-color:#fafafa; margin-top:20px;">
                                                    <tr mc:repeatable>
                                                        <td valign="top">
                                                            <img src="http://cdn.popsbuy.com/emailing/y/images/arama.png" style="max-width:69px;float:left;margin-right:15px;" mc:label="image" mc:edit="tiwc200_image01" /><h4 class="h4" style="float: left;">ARAMA</h4>
                                                            <div mc:edit="tiwc200_content01" style="text-align:center; margin-top:10px;clear:both;"><br />

                                                             Aradığın ürüne, siteye, markaya doğrudan Popsbuy hesabınla erişebilirsin.

                                                            </div>
                                                        </td>
                                                    </tr>
                                                </table>
                                                <!-- // End Module: Top Image with Content \\ -->

                                            </td>

阿拉马


阿拉德·努尔内、斯泰耶、马尔卡亚·多奥鲁丹·波普斯比·赫萨布·埃利·埃比利尔辛。

---

让HTML电子邮件在所有客户中看起来都很棒，这几乎是每个尝试过电子邮件营销的人都会遇到的问题。对于您的问题没有简单的答案，但我会首先使用如下工具跟踪并测试您的电子邮件模板。

您需要在每个表单元格中重新声明您的字体堆栈

另外，避免使用边距，而是在

标记中使用填充

浮动也没有得到广泛支持。如果要浮动，应该使用

align=“left”

，但对于您的示例，最好将其保留在表中

您的代码应该如下所示：

<table width="200" border="0" cellpadding="0" cellspacing="0">
  <tr>
    <td width="60">
      <img src="http://cdn.popsbuy.com/emailing/y/images/arama.png" mc:label="image" mc:edit="tiwc200_image01" />
    </td>
    <td width="140" style="font-family: Helvetica, Arial, sans-serif; font-size: 14px; color: #000000; font-weight:bold; padding-left:15px; font">
      ARAMA
    </td>
  </tr>
  <tr>
    <td width="100%" colspan="2" style="font-family: Helvetica, Arial, sans-serif; font-size: 14px; color: #000000;">
      <div mc:edit="tiwc200_content01" style="text-align:center; margin-top:10px;clear:both;"><br />
       Aradığın ürüne, siteye, markaya doğrudan Popsbuy hesabınla erişebilirsin.
      </div>
    </td>
  </tr>
</table>

阿拉马


阿拉德·努尔内、斯泰耶、马尔卡亚·多奥鲁丹·波普斯比·赫萨布·埃利·埃比利尔辛。

---

我将表格宽度设置为200，如果愿意，您可以将其更改为基于百分比。

浮动在Outlook 2007+中根本不起作用。2007+版本的Outlook for Windows使用Office作为渲染引擎，因此无法正确渲染标准HTML

Align通常会起作用，但最安全的做法是创建一个两列表格，左边是图像，右边是文本。图像列应具有明确设置的宽度。（不要试图使表格超过一行。在电子邮件HTML中，嵌套一系列简单表格比创建一个复杂表格更好。）

确保在表标记中使用适当的老式pre-HTML4标记属性。特别是，要获得布局，请确保表格单元格具有“valign='middle'”

---

如果您通过Mailchimp或Campaign Monitor等主要电子邮件服务提供商发送邮件（您应该这样做，以保护列表的完整性），它将为您内联所有样式代码——因此您实际上不需要为每个表单元格重新声明样式，只需使用嵌入式样式表即可

mailchimp模板也是一个很好的资源：更多的列表