HTML 电子邮件中的背景图像在 Android 6.0 和 4.4 上无法正确呈现答案

【问题标题】：background Image in HTML Email not rendering correctly on Android 6.0 & 4.4HTML 电子邮件中的背景图像在 Android 6.0 和 4.4 上无法正确呈现
【发布时间】：2017-09-20 02:49:58
【问题描述】：

我目前正在处理一封 HTML 电子邮件，但背景图像未呈现，它是一部手机，屏幕内有另一张照片。它适用于其他电子邮件客户端，但对于 Android 6.0 和 Gmail 应用程序 IMAP Android 4.4，我只是在假设在手机屏幕中的图像后面得到一个灰色背景。是否缺少某些东西或 android 对 HTML 或 CSS 的背景做了什么

<td class="rightContainr" width="260" style="max-width: 260px; max-width: 260px;">
            <!--[if (gte mso 9)|(IE)]>
              <table width="200" align="center" cellpadding="0" cellspacing="0" border="0">
                <tr>
                  <td>
            <![endif]-->
            <table class="phoneContainr" width="152" border="0" cellspacing="0" cellpadding="0" style="align:left; max-width: 152px;">
              <tr>
                <td class="phone" align="center" background="http://mailimages.texture.com/print-toGo_2016/background_day0_phone_200x360.png" style="background-image: url('http://mailimages.texture.com/print-toGo_2016/background_day0_phone_200x360.png'); background-size: 180px 324px;" bgcolor="#F2F2F2" width="152" height="312" valign="middle">
                  <!--[if gte mso 9]>
                    <v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style="width:153px;height:324px;">
                      <v:fill type="tile" src="http://mailimages.texture.com/print-toGo_2016/background_day0_phone_200x360.png" color="#F2F2F2" />
                      <v:textbox inset="0,0,0,0">
                  <![endif]-->
                  <div>
                    <table class="cover" align="center" width="140" border="0" cellspacing="0" cellpadding="0" style="align:left; max-width: 126px;">
                      <tr>
                        <td class="cover"><img class="cover" src="http://image.email.texture.com/lib/fe9a12717365047e71/m/14/featured_story_280x330.jpg" width="126px" height="auto" alt="" style="display: block; max-width: 126px;"></td>
                      </tr>
                    </table>
                  </div>
                  <!--[if gte mso 9]>
                      </v:textbox>
                    </v:rect>
                  <![endif]-->
                </td>
              </tr>
            </table>
            <!--[if (gte mso 9)|(IE)]>
                  </td>
                </tr>
              </table>
            <![endif]-->
          </td>

【问题讨论】：

它对你有用吗？

标签： android html css html-email

【解决方案1】：

Gmail 应用上的背景图片有问题。请阅读以下内容了解更多信息。

如果电子邮件已发送，则背景图片在 Gmail 应用中可以正常显示到 Gmail 电子邮件地址（即 gmail.com）并从中检索。

随着谷歌放弃原生，这个问题将变得更加严重 Android 邮件客户端支持 Gmail 移动应用程序操作系统从 5.0 (Lollipop) 开始。安卓用户需要访问其工作电子邮件的设备必须使用 Gmail 应用或第 3 方邮件应用。

Full article

如果您真的想走这条路，您可以使用两张图片并使用媒体查询在 Gmail 应用程序上控制它。使用位置将一张图像放在另一张图像上（仅适用于移动屏幕宽度），您应该很高兴。请记住，Gmail 应用（最新版本）现在支持媒体查询，这将成为可能。

希望这能回答你的问题。

【讨论】：