html - 在 Outlook 中浮动替换电子邮件

Question

这是这个问题的后续问题。

我正在写这封两栏的电子邮件，有人建议float:left我在我的 td 上使用，以便宽度适合电子邮件。但是，我认为 Outlook 不支持浮动，并且我的右列被推到了整个表格的范围之外。

这是电子邮件在 Outlook 中呈现方式的屏幕截图：

代码可以在这里找到。

Answer 1

浮动 atd是一件非常奇怪的事情。我没有尝试过，但我的猜测是某些版本的 IE 根本不会做任何事情（因此，出于您的担忧，某些版本的 Outlook 可能会显示相同的行为，或者不会显示相同的行为，具体取决于版本和安装 MS 的顺序Office 和 IE）。

浮动电子邮件客户端的任何元素也是一个坏主意，因为 hotmail/outlook.com 和 Outlook 桌面的大多数版本不支持该float属性。

见： http: //www.campaignmonitor.com/css/

编辑：它与浮动或对齐无关。该表中有 6 行，第二行有 2 列，其余的都有 1 列。每个表必须具有相同数量的列，因此您可以colspan在其他所有 5 个上使用该属性，tr以便该表占tr2的列td，如下所示<tr colspan="2"...。然后删除所有浮动，是不必要的。

有关详细信息，请参阅http://www.w3.org/TR/REC-html40/struct/tables.html#adef-colspan。

Answer 2

您可以使用 align 属性实现类似的浮动效果，例如align="left"嵌套表。

<table cellpadding="0" cellspacing="0" border="1" width="600">
<tr>
    <td align="center" height="100" width="600">
        header
    </td>
</tr>
<tr>
    <td>
        <table align="left" cellpadding="0" cellspacing="0" border="1" height="50" width="298">
            <tr>
                <td>
                      column 1 
                </td>
            </tr>
        </table>
        <table align="left" cellpadding="0" cellspacing="0" border="1" height="50" width="298">
            <tr>
                <td>
                      column 1 
                </td>
            </tr>
        </table>
    </td>
</tr>

 <tr>
    <td align="center" height="100" width="600">
        footer
    </td>
</tr>

这是一个小提琴。我希望这有帮助。