HTML邮件兼容性
布局使用 table以及table 嵌套（避免colspan / rowspan），table / tr / td / span / img / a，避免div / p
table边框<table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse;"></table>
body 外的内容几乎没用
在body内写样式（Gmail会删除所有style）或者内联样式
属性先于样式，<img style="width: 10px; height: 10px;" src="http://www.mamicode.com/*.png" />改为<img src="http://www.mamicode.com/*.png" />，常用属性width、height、bgcolor、align、valign
每个标签单独指定样式，，例如table的font-family
背景图片，<td background="http://www.mamicode.com/*.png"></td>
width 和 height 属性不加单位，<img src="http://www.mamicode.com/*.png" />改为<img src="http://www.mamicode.com/*.png" />
图片的margin 和padding，建议<img vspace="10" hspace="10" src="http://www.mamicode.com/*.png" />
字体、颜色、加粗，font: 12px / 14px Arial, sans-serif;color: #999;改为line-height: 14px;font-size: 12px; font-family: "微软雅黑", Arial, sans-serif; color: #999999; 加粗使用b而不是font-weight
行高，OutLook 有默认最小行高，使用OutLook 自定义属性mso-line-height-rule:exactly（该属性只在块元素上有效）来取消限制（这种实现方式有点瑕疵，就是会导致大号字体无法垂直居中），<td></td>
部分2：
出于兼容性的考虑，border="0" 和，双重保障
只要不是行内的图片，样式 几乎是标配。
尽可能不要使用span，因为其在某些邮箱里会导致换行。
如果不想邮件被转发后支离破碎，邮件最好不要用多个 table 拼装，而是要嵌套起来。
iframe内容是作为独立的document，以iframe作为展现方式的邮箱
图片上务必加上alt，所有的图片都要定义高和宽；
制作一份和邮件内容一样的web页面，然后在邮件顶部写一句话，类似：“如果您无法查看邮件内容，请点击这里查看”
示例代码：
<body style="margin: 0; padding: 0;"> <table align="center" border="1" cellpadding="0" cellspacing="0" width="600" style="border-collapse: collapse;" background="background.gif"> <tr> <td bgcolor="....."> Row 1 </td> </tr> </table> </body>
汇总于https://blog.csdn.net/weixin_30662109/article/details/96447425
更多参考资料：
https://www.campaignmonitor.com/css/email-client/outlook-2007-16/
https://docs.microsoft.com/en-us/previous-versions/office/developer/office-2007/aa338201(v=office.12)?redirectedfrom=MSDN
https://www.cnblogs.com/dolphinX/p/4081828.html
温馨提示: 本文由Jm博客推荐，转载请保留链接: https://www.jmwww.net/file/web/42498.html
- 上一篇：Jenkins之配置GitHub
- 下一篇：第二十章 无状态Web应用集成
![[转]Node.js中package.json中^和~的区别](/uploads/allimg/200519/054J34453_lit.png "[转]Node.js中package.json中^和~的区别")