Question

我正在使用html进行电子邮件广告系列，但我遇到了问题，我有以下代码：

 <TABLE width="550px" height="723px" BACKGROUND="FlyerImage.jpg" border="0" cellpadding="0" cellspacing="0">
 <TR> 
    <TD style="padding-top:190px; padding-right:30px; line-height:0px;" align="right"> 
        <a style="line-height:0px;" href="http://LINK.com/"> 
            <img src="ViewOffer.png">
        </a> 
    </TD>
 </TR>

 <TR> 
    <TD style="padding-bottom:185px; padding-left:35px; line-height:0px;" align="left"> 
        <a style="line-height:0px;" href="http://LINK.com/"> 
            <img src="ViewMore.png">
        </a> 
    </TD>
 </TR>

</TABLE>

此代码适用于Gmail，Hotmail，Yahoo和某些电子邮件客户端，但在OUTLOOK中显示效果不正确，我很确定这是因为Outlook不支持桌面上的背景图像。

我正在使用电子邮件营销活动网络客户端，建议使用内联css进行标记，不使用html，head和body标签，不使用div而不使用定位（绝对，相对，固定......）和用表格标记。

如何在不使用这些技术的情况下，将两个号召性用语按钮放置在特定地点的主图像上？

提前致谢=]！

Answer 1

如果不支持CSS，则无法保证将按钮定位在图像顶部。在这种情况下，我建议您更改为使用图片地图。这是没有CSS的纯HTML，但我真的不知道它是否得到了所有电子邮件客户端的支持。

您可以将按钮图像合并到主图像中，然后设置坐标（我不知道它们，它们由下面的“？”表示）。类似的东西：

<img src="FlyerImage.jpg" alt="alternative text" usemap="#flyer" />
<map name="flyer">
  <area shape="rect" coords="?,?,?,?" href="http://LINK.com/" /> <!--button 1-->
  <area shape="rect" coords="?,?,?,?" href="http://LINK.com/" /> <!--button 2-->
</map>

Answer 2

HTML电子邮件中不支持背景图像和定位。这是一个很好的参考：http://www.campaignmonitor.com/css/

Answer 3

我从来没有尝试过，但看起来有一种令人讨厌的方式迫使Outlook支持背景图像。 Link

如何在不使用定位，分区或背景的情况下将图片放在其他图像上？

3 个答案: