基於邊框的按鈕
此技術依賴於為連結本身新增粗邊框以構建按鈕的 CTA。電子郵件客戶端普遍理解使用邊框,但限制按鈕外觀純色。
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td>
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td bgcolor="#0095FF" style="padding: 12px 18px 12px 18px; -webkit-border-radius:3px; border-radius:3px" align="center"><a href="http://www.stackoverflow.com" target="_blank" style="font-size: 14px; font-family: sans-serif; font-weight: normal; color: #ffffff; text-decoration: none; display: inline-block;">Stack Overflow</a></td>
</tr>
</table>
</td>
</tr>
</table>
https://i.stack.imgur.com/bE0S2.jpg
連結標記設定為塊級元素,並且邊框用於提供填充,因此即使在較舊的桌面客戶端中,整個按鈕也可以快取+可點選。
基於邊框的按鈕的缺點是 Outlook 會將邊框的大小減小一些,如上所述,不支援背景影象。