Question

有没有人有使用空表，表格行或表格单元格作为布局间隔符的经验？

我一直在各种电子邮件客户端（Mail，Entourage，Gmail等）中测试我的HTML电子邮件，Gmail似乎对空表格单元做出了不同的反应（根本不考虑它们）。我在桌面的CSS中使用“empty-cells：show”以及非破坏空间但仍然没有运气。如果可能的话，我绝对不想使用图像作为间隔物。

Answer 1

如果你想使用空的TD-s而不是间隔物，你应该提供宽度和高度，如下所示：

<td width="111" style="font-size:1px;line-height:21px;">&nbsp;</td>

你可以在这里看到我使用line-height来设置表格单元格高度而不是height =“21”。这将在所有主流浏览器和电子邮件客户端中呈现出属性，即使是较旧的浏只需确保字体大小始终小于行高。

这样你就不用再使用垫片了。还有一件事。在TR中，除了TD-s内有图片外，你不需要放任何东西。 Gmail在渲染图片方面存在一些问题，因此我采用了这种方式修复：

<tr style="font-size:0px; line-height: 0px;">
<td width="135" valign="top" align="left" height="120" >
<img width="135" height="120" border="0" alt="" src="image source here">
</td>
</tr>

Answer 2

某些电子邮件客户端会折叠空单元格，即使它包含空格，或者即使分配了维度也是如此。但我发现如果你在一个空表中放置一个空表并仅将维度分配给父表，所有客户端都会认为父表不是空的，因为它包含另一个表，因此它适用于所有客户端和设备。

为了进一步提高兼容性，最好使用主要的cellpadding来定义必要的尺寸，并且行上的最小高度超过3px。 td应该大于3px，因为3px以下的任何东西都可以被忽略。但是应该接近3 px，因为如果通过cellpadding获得尺寸，则cellfeding比行高度更受尊重。

例如，如果我想要一个18px高的空间，我将指定cellpadding 7和td height 4，它出现在（7 * 2）+ 4 = 18。

<table border="0" cellpadding="7" cellspacing="0" width="100%">
    <tr>
        <td height="4">
            <table border="0" cellpadding="0" cellspacing="0">
                <tr>
                    <td></td>
                </tr>
            </table>
        </td>
    </tr>
</table>

Answer 3

使用＆amp; nbsp;如果你没有＆amp; nbsp;而不是间隔符，你总是堆栈指定带有样式标记的行高。将默认为20px行高。

Answer 4

使用 “填充”空单元格中的空格。

HTML电子邮件 - 空表/ TR / TD作为间隔符

4 个答案: