单柱流体布局

混合编码的基本设置是单个流体柱。由于大多数电子邮件客户端支持 max-width,我们可以使用它来将 <table> 的宽度设置为 100%(流体),但不超过最大宽度(在这种情况下为 660px)。就像在网上一样。

但是,Windows 桌面 Microsoft 不支持 max-width 并且会以 100%的宽度呈现此表,因此我们使用 Microsoft 条件标签来设置“ Ghost Tables ”,使 <table> 的宽度为 660px。Windows 桌面 Microsoft 仅限台式机,所以它不需要在小尺寸上流畅。而且由于 Windows 桌面 Microsoft 是唯一支持这些 Microsoft 条件标记的电子邮件客户端,因此不会无意中将其他客户端限制为 660px 桌面宽度。

<table cellpadding="0" cellspacing="0" border="0" width="100%" style="">
    <tr>
        <td align="center" height="100%" valign="top" width="100%">
            <!--[if mso]>
            <table align="center" border="0" cellspacing="0" cellpadding="0" width="660">
            <tr>
            <td align="center" valign="top" width="660">
            <![endif]-->
            <table align="center" border="0" cellpadding="0" cellspacing="0" width="100%" style="max-width:660px;">
                <tr>
                    <td align="center" valign="top">
                        <p>Content Goes Here.</p>
                    </td>
                </tr>
            </table>
            <!--[if mso]>
            </td>
            </tr>
            </table>
            <![endif]-->
        </td>
    </tr>
</table>