2017年是否有办法在HTML电子邮件中的主图像上显示基于图像或基于文本的叠加，以便大多数当前正确呈现桌面和Web电子邮件客户端：Outlook 2007 +，Thunderbird，移动客户端，GMail，Outlook.com，Yahoo Mail等？
例如，它可能是在主图像上呈现的小型播放按钮，点击后会将您带到视频网址。
答案 0 :(得分：4)
是的，虽然它需要很多代码，因为Outlook不支持CSS background-image，所以除了 CSS之外我们还必须使用VML 来获取到处显示背景图像。 backgrounds.cm是一个很好的起点，但在一段时间内还没有更新。这样的事情是一个很好的起点：
<tr>
<!-- Bulletproof Background Images c/o https://backgrounds.cm -->
<td background="http://placehold.it/600x180/222222/666666" bgcolor="#222222" valign="middle" style="background-position: center center !important; background-size: cover !important;">
<!--[if gte mso 9]>
<v:image xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style="border: 0; display: inline-block; width: 600px; height: 180px;" src="http://placehold.it/600x180/222222/666666" />
<v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style="border: 0; display: inline-block; position: absolute; width: 600px; height: 180px;">
<v:fill opacity="0%" color="#222222" />
<![endif]-->
<div>
<!--[if mso]>
<table role="presentation" border="0" cellspacing="0" cellpadding="0" align="center" width="600">
<tr>
<td align="center" valign="top" width="600">
<![endif]-->
<table role="presentation" border="0" cellpadding="0" cellspacing="0" align="center" width="100%">
<tr>
<td valign="middle" style="padding: 20px; color: #ffffff;">
<img src="http://placehold.it/100" height="100" width="200" alt="">
<p style="margin: 0;">Maecenas sed ante pellentesque, posuere leo id, eleifend dolor. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Praesent laoreet malesuada cursus. Maecenas scelerisque congue eros eu posuere. Praesent in felis ut velit pretium lobortis rhoncus ut erat.</p>
</td>
</tr>
</table>
<!--[if mso]>
</td>
</tr>
</table>
<![endif]-->
</div>
<!--[if gte mso 9]>
</v:fill>
</v:rect>
</v:image>
<![endif]-->
</td>
</tr>
答案 1 :(得分：1)
使用VML仍然是在Outlook环境中获得背景图像支持的唯一方法。 所以你想要使用这个工具 https://backgrounds.cm/
将图片网址放入，将其设置为“单桌销售”字样。并设置一些尺寸，然后您只需在<div>标记