Html_email-cheatsheets速查表
Properties to avoid
| Property | Where |
|---|---|
position |
(Outlook, Gmail, Yahoo) |
display |
(Outlook, Gmail) |
float |
(Outlook) |
| --- | --- |
height |
(Outlook) |
width in p/div |
(Outlook) |
padding in p/div |
(Outlook) |
background |
(Outlook, Gmail) |
min-width |
(Outlook) |
max-width |
(Outlook) |
| --- | --- |
opacity |
(Outlook, Gmail, Yahoo) |
box-shadow |
(Outlook, Gmail, Yahoo) |
| --- | --- |
rgba() |
(Outlook) |
data-uri |
(all webmail) |
Selectors to avoid
| E[attr] | (Outlook, Gmail) |
| E:nth-child(n) | (Outlook, Gmail) |
| ::before and ::after | (Outlook, Yahoo, Gmail) |
| E F | (Gmail) |
| E + F, E > F etc | (Outlook, Gmail) |
Inline your CSS as much as possible.
Basic layout
<table cellpadding="0" cellspacing="0">
<tr>
<td width="auto"></td>
<td width="600" background="#ffffff">
···
</td>
<td width="auto"></td>
</tr>
</table>Responsive
<style>
@media only screen and (max-device-width: 480px)
</style><style> is supported in the head and body by everything except Gmail. Only use them for responsive styles.
References
{: .-one-column}
- CSS support matrix campaignmonitor.com