时间戳

首页 > 解决方案 > CSS 背景图像“图像”未显示在 Outlook 中

email - CSS 背景图像“图像”未显示在 Outlook 中

问题描述

我创建了一个基于 HTML 的电子邮件，其中一个元素定义了一个“背景图像”属性。在 Outlook 中发送和接收电子邮件时，不显示背景图像。在 Gmail 中收到它时，它会显示出来。我认为这可能与 Outlook 特定的限制有关？这是HTML代码：

<div style="text-align: center; background-image:url('http://image.info.geha.com/lib/fe44157075640479741475/m/1/34273cbe-2375-4a73-aec2-5151bf51cf91.jpg'); border-color:#e3e4e5">
 <p style=" align: center; bottom: 50px; left: 100
px;">
  <br>
  <span style="color:#500778;"><span style="font-size:20px;">GEHA EXCLUSIVES</span><br>
  <span style="font-size:18px;">______</span></span><br>
  <br>
  <br>
  <span style="color:#ee7623;"><u><span style="font-size:18px;"><a href="#">Link to website content goes here</a></span></u></span><br>
  <br>
  <span style="color:#ee7623;"><u><span style="font-size: 18px; text-align: center;"><a href="#">Link to website content goes here</a></span></u></span><br>
  <br>
  <span style="display: none;">&nbsp;</span><span style="color:#ee7623;"><u><span style="font-size: 18px; text-align: center;"><a href="#">Link to website content goes here</a></span></u></span><br>
  <br>
  <br>
  <br>
  <span style="display: none;">&nbsp;</span></p></div>

这是 Outlook 的渲染：

在此处输入图像描述

这是 Gmail 的渲染图：

在此处输入图像描述

任何想法为什么会这样？

标签： emailoutlookhtml-email

解决方案

Outlook 2000-03 支持背景图像，因为它们使用 Internet Explorer 作为其呈现引擎。然而，在 Outlook 2007-16 中，他们切换到了 Microsoft Word，这让他们非常头疼。

除非您使用 VML，否则 Outlook 07-16 将不支持背景图像。Campaign Monitor 有一个不错的工具来构建该代码：https ://backgrounds.cm/

另一种选择是在您的 div 上使用 bgcolor 属性。Outlook 07-16 是唯一仍支持该功能的电子邮件浏览器。所有其他浏览器都将使用您的背景图像。你不会有圆角，但你的灰色背景会在那里。

有关哪些浏览器支持什么的任何其他问题，请使用此列表：https ://www.campaignmonitor.com/css/color-background/background-image/

推荐阅读