HTML 电子邮件 Gmail 应用程序 (Android 6) - 如何消除图像之间的垂直间隙答案

【问题标题】：HTML Email Gmail App (Android 6) - How to remove vertical gap between imagesHTML 电子邮件 Gmail 应用程序 (Android 6) - 如何消除图像之间的垂直间隙
【发布时间】：2018-03-20 15:23:26
【问题描述】：

我在使用 Gmail 应用程序 (Android 6.0) HTML 电子邮件呈现图像之间的垂直间隙时遇到问题。我在 Litmus 中的其他客户端/屏幕组合中完全没有问题 - 桌面、移动、Outlook、IOS、AOL 等

如果我删除图像之间的 td 标签并使用左浮动，Android 会将图像堆叠在一起。

如果我替换

<!--[if !gte mso 15]><!--></td><td valign="bottom"><!--<![endif]-->

与

</td><td>

正如我最初所做的那样，Gmail 应用程序和 Outlook 都有垂直线间隙。

谁能提出改进代码的方法？

谢谢

<table width="640" border="0" cellspacing="0" cellpadding="0" style="text-decoration:none;border-collapse:collapse;mso-table-lspace:0pt;mso-table-rspace:0pt;table-layout:fixed;border-spacing:0;table-layout:auto;border-collapse: collapse;mso-table-lspace: 0pt;mso-table-rspace: 0pt;text-decoration: none;table-layout: auto;border-spacing: 0; ">
<tbody>
  <tr>
    <td>
      <a target="_blank" href="http://www.....com/why-use-a-centrifugal-separator.html" style="color:#000000;cursor:pointer;text-decoration:none !important;color: #000000;cursor: pointer;text-decoration: none !important;"><img width="231" height="202" border="0" alt="Read more about keeping oil cleaner longer" src="http://www.....com/emailer/201709/images/keepoilcleanerlonger_100_231x202.jpg" style="-ms-interpolation-mode:bicubic;text-align:center;line-height:20px;width: 231px; height: 202px; display: block; margin: 0px; outline: none;text-decoration: none;-ms-interpolation-mode: bicubic;border: none;display: block;"></a>
      <!--[if !gte mso 15]><!--></td><td valign="bottom"><!--<![endif]-->
      <a target="_blank" href="http://www.....com/why-use-a-centrifugal-separator.html" style="color:#000000;cursor:pointer;text-decoration:none !important;color: #000000;cursor: pointer;text-decoration: none !important;"><img width="178" height="202" border="0" alt="Read more about reducing man service hours" src="http://www.....com/emailer/201709/images/reduceservicemanhours_100_178x202.jpg" style="-ms-interpolation-mode:bicubic;text-align:center;line-height:20px;width: 178px; height: 202px; display: block; margin: 0px; outline: none;text-decoration: none;-ms-interpolation-mode: bicubic;border: none;display: block;"></a>
      <!--[if !gte mso 15]><!--></td><td valign="bottom"><!--<![endif]-->
      <a target="_blank" href="http://www.....com/assets/web-and-email-a4-mp200-data-sheet-v08.pdf" style="color:#000000;cursor:pointer;text-decoration:none !important;color: #000000;cursor: pointer;text-decoration: none !important;"><img width="231" height="202" border="0" alt="Read more about adding to existing power units" src="http://www.....com/emailer/201709/images/addtoexistingpowerunits_100_231x202.jpg" style="-ms-interpolation-mode:bicubic;text-align:center;line-height:20px;width: 231px; height: 202px; display: block; margin: 0px; outline: none;text-decoration: none;-ms-interpolation-mode: bicubic;border: none;display: block;"></a>
    </td>
    </tr>
</tbody>

【问题讨论】：

给 td 一个与图像相同的背景颜色。将修复它;-)

标签： android gmail html-email

【解决方案1】：

我发现了你的问题。您使用了无效的 href 和 img 代码。

这永远不会用作网址或图片：

http://www.....com

我可以将它们换成占位符图像，也许可以更好地了解您的实际问题是什么，但如果您只发布您的代码的一部分，我只能发布您的解决方案的一部分问题。

我看到你也没有收到关于 Litmus 的回复。

【讨论】：