我遇到Outlook(惊喜)问题并在表格单元格中有背景图像。 现在的问题是我可以在99%的Outlook版本中使用它,但2016年的桌面版在Windows 10上运行。
以下是块的代码:
<table align="center" bgcolor="#ffffff" border="0" cellpadding="0" cellspacing="0" class="w-full" style="vertical-align:top; width: 640px;" width="640">
<tr>
<td class="w-full" background="http://via.placeholder.com/640x320" bgcolor="#7bceeb" width="640" valign="top">
<!--[if gte mso 9]>
<v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style="width:1280px;">
<v:fill type="tile" src="http://via.placeholder.com/640x320" color="#ffffff" />
<v:textbox style="mso-fit-shape-to-text:true" inset="0,0,0,0">
<![endif]-->
<div>
<table align="" border="0" cellpadding="0" cellspacing="0" class="w-full" style="vertical-align:top;" width="640">
<tr>
<td valign="top">
<table border="0" cellpadding="0" cellspacing="0" class="w-full" width="640">
<tr>
<td height="35" style="text-align: center;"> </td>
</tr>
<tr>
<td align="center" style="color:#FFFFFF; font-size:24px;">
<div style="font-family:'Century Gothic', Helvetica, Arial, sans-serif; color: #ffffff; text-transform: uppercase;"> <font face="'Century Gothic', Helvetica, Arial, sans-serif"><span style="font-size:44px;">Lorem Ipsum</span><br>
<br>
<span style="font-size:24px;">SOME TEXT HERE<br>
with a page break here</span></font>
<br>
<br> </div>
<table align="center" border="0" cellpadding="0" cellspacing="0">
<tr>
<td align="center" style=" font-family:'Century Gothic', Helvetica, Arial, sans-serif; font-size:14px; color:#ffffff; text-transform: uppercase; font-weight: bold;"> <a href="#" style="color:#ffffff; text-decoration:none; padding:14px 30px; display:inline-block; border:solid 1px #ffffff;" target="_blank">CTA Text</a></td>
</tr>
</table>
</td>
</tr>
<tr>
<td height="35"> </td>
</tr>
</table>
</td>
</tr>
</table>
</div>
<!--[if gte mso 9]>
</v:textbox>
</v:rect>
<![endif]-->
</td>
</tr>
</table>
这会产生这样的结果: 2016 Desktop
然而,它会杀死其他版本: All other versions
如果我将VML宽度从1280px减小到它应该是什么(640px),它会修复所有其他版本,但是,只能在桌面客户端中给我一半图像(基本上是极端相反)。
现在我的理解是这个桌面客户端可能会以更高的DPI /分辨率渲染,因此为什么加倍宽度会给我正确的结果,实际的宽度给我半个单元格。
我的问题是,是否有一个工作轮/黑客允许我在该客户端以双倍宽度显示并让其他人忽略此规则?
任何帮助都会受到赞赏,因为我无法在任何地方找到任何信息,提前谢谢。
答案 0 :(得分:0)
经过一周的狩猎,我遇到了这篇文章,解决了我遇到的问题:
Solving DPI scaling issues with HTML email in Outlook
很清楚为什么它会破坏以及如何对抗它,所以我强烈建议您查看它以完全理解这个问题。
但是,如果您急于求助并且只想快速修复代码,则需要将以下代码插入模板的HTML标记中:
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office">
这告诉Outlook会发生什么 然后,您需要在 关闭之前将此代码插入模板 的HEAD部分:
<Head>
<!--[if gte mso 9]>
<xml>
<o:OfficeDocumentSettings>
<o:AllowPNG/>
<o:PixelsPerInch>96</o:PixelsPerInch>
</o:OfficeDocumentSettings>
</xml>
<![endif]-->
</Head>
最后,和以前一样(参见原始问题),你需要告诉单元格确切地说它需要做什么类似于:
<!--[if gte mso 9]>
<v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style="width:640px;">
<v:fill type="tile" src="http://via.placeholder.com/640x320" color="#ffffff" />
<v:textbox style="mso-fit-shape-to-text:true" inset="0,0,0,0">
显然,根据需要调整自己的电子邮件,但这对我有用。 我希望这个答案对其他人有帮助,因为它可以帮助我归结为使用更高分辨率显示器的新机器上的DPI缩放!
此解决方案完全归功于“詹姆斯”。