如何删除电子邮件中发送的表格行之间的白线？答案

【问题标题】：How do I remove white lines between table rows send in an email?如何删除电子邮件中发送的表格行之间的白线？
【发布时间】：2013-11-10 13:48:33
【问题描述】：

我有下表用于对 html 电子邮件内容的图像进行分组

    <table cellpadding="0" cellspacing="0">
        <tr>
            <td colspan="2">
                <img src="/SaveDateHeader.png" style="border: none;font-size: 14px;font-weight: bold;height: auto;line-height: 100%;outline: none;text-decoration: none;text-transform: capitalize;" />
            </td>
        </tr>
        <tr><td colspan="2"><img src="/body.png" style="border: none;font-size: 14px;font-weight: bold;height: auto;line-height: 100%;outline: none;text-decoration: none;text-transform: capitalize;" /></td></tr>
        <tr>
            <td>
                <a href="" target="_blank">
                    <img src="/leftfooter.png" style="border: none;font-size: 14px;font-weight: bold;height: auto;line-height: 100%;outline: none;text-decoration: none;text-transform: capitalize;" />
                </a>
            </td>
            <td>
                <a href="" target="_blank">
                    <img src="/rightfooter.png" style="border: none;font-size: 14px;font-weight: bold;height: auto;line-height: 100%;outline: none;text-decoration: none;text-transform: capitalize;" />
                </a>

            </td>
        </tr>
    </table>

它在 Outlook 和移动设备中看起来不错，但是当我在 gmail.com 上查看它时，表格行之间会出现空格。

我的第一种方法是使用浮动 div，但在移动设备上查看时会出现一系列不同的问题。

我发现了这个问题，但没有一个建议对我有用。 How to remove the divide between table rows in e-mail shot?

【问题讨论】：

可能是图像相关问题，而不是表格相关问题。
我会玩弄这些图像，看看能不能做得更好。但是，使用开发人员工具，我能够确定差距不是由图像引起的。我检查了每个元素，它似乎是单元格或行。由于最后一行的两个单元格之间没有出现间隙，我假设它是该行。但我相当确定这些图像不会导致问题。

标签： html css email

【解决方案1】：

在您的所有图片中添加"display: block;"。我怀疑这实际上是一个图像问题。此外，您必须在电子邮件中进行基于表格的布局。不要尝试使用现代策略！一切的表格和内联样式。另外，尝试折叠一些空白区域。

【讨论】：

我不确定是哪一个做的，但我将所有样式移入内联，将显示更改为阻止并删除所有空格和换行符。它奏效了。谢谢！