newsletter background images not showing in outlook w10 app

时间:2015-11-12 11:07:18

标签: outlook html-email newsletter

Before asking I have tried all possibles solutions posted here but I can't make this work. Also i am not sure if its working regular outlook or I just have the issue on the w10 mail app.

This is the code I am using.

<td background="image.jpg" bgcolor="#e7e7e9" width="299" height="274" valign="top">
  <!--[if gte mso 9]>
  <v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style="width:299px;height:274px;">
    <v:fill type="tile" src="image" color="#e7e7e9" />
    <v:textbox inset="0,0,0,0">
  <![endif]-->
  <div>
  </div>
  <!--[if gte mso 9]>
    </v:textbox>
  </v:rect>
  <![endif]-->
</td>

Any guidelines would be appreciated

Thanks

2 个答案:

答案 0 :(得分:1)

虽然在W10应用程序中支持VML,但背景和防弹按钮&#39;通过VML不再有效。我没有找到一个很好的技术解释,但是通过我自己的测试以及其他论坛和博客,我收到了很多其他同意这些不再适用于W10应用程序的人。

有关W10应用的更多详细信息,请参阅这些博文。大多数对电子邮件背景问题的引用都在评论部分。

http://freshinbox.com/blog/the-outlook-team-reaches-out/

https://blog.jmwhite.co.uk/2015/04/11/an-email-developers-first-look-at-the-outlook-mail-app-in-windows-10/

答案 1 :(得分:1)

通过搜索网络,我发现并改编了一个基于VML的解决方案,该解决方案也向后兼容Outlook。

注意:这仅适用于嵌入在表格单元格中的背景图像。我还没有尝试过这样的全身电子邮件背景图片。一旦我这样做,我就会更新这篇文章。

背景信息(无双关语)

之前用于在Outlook电子邮件(版本2007,2010,2013,2016)中嵌入背景图像的基于VML的黑客对Windows 10电子邮件应用程序(Win10应用程序)不起作用。作为参考,您可以在backgrounds.cm找到该解决方案。

Microsoft继续使用Microsoft Word作为其HTML呈现引擎,但我猜他们对Win10应用程序的渲染引擎进行了更改,从而影响了其VML支持。

注意:我的示例使用尺寸为640x254的图像。注意:我感觉XML命名空间是重复的,但是因为它有效,所以我不想搞砸它。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml" xml:lang="en" lang="en">
<head>
    <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    <title>Your Title</title>
</head>
<body>
    <table width="640" align="center" cellpadding="0" cellspacing="0" style="margin:0 auto;">
    <tr><td height="254" background="http://yourimagepath.jpg" style="background:url(http://yourimagepath.jpg) no-repeat 0 0;">
    <!--[if gte mso 9]>
        <v:image xmlns:v="urn:schemas-microsoft-com:vml" id="theImage" style="behavior:url(#default#VML);position:absolute;width:640px;height:254px;top:0;left:0;z-index:-1" src="http://yourimagepath.jpg"/>
    <![endif]-->
    </td></tr>
    </table>
</body>
</html>

我强调了我添加或需要确保其有效的具体内容。

enter image description here

改编自