單柱流體佈局
混合編碼的基本設定是單個流體柱。由於大多數電子郵件客戶端支援 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>