在桌面和移动端渲染电子邮件大约有上百万种不同的组合方式。
尤其是鼎鼎大名的 OutLook，从 OutLook2007 开始便使用 Word HTML 引擎进行渲染，为了它的安全性从而使得整个邮件倒退回了 2000 年前，为了邮件的兼容性你不得不使用很多废弃的标签、属性，并且这一状况将会维持无数个
年头，因为虽然万事终有尽头，但 OutLook 始终存在。
因为微软一向地特立独行，使得 OutLook 成为了最难啃的骨头。因为 OutLook 支持的标签和属性少得可怜，所以只要兼容了 OutLook，其他邮箱客户端基本都不会有什么问题。
使用tableb布局
这几乎是 HTML 邮件与普通 HTML 页面最大的区别，因为各个邮箱对 div + css 这一套布局的解析问题很大（如 float / position 等 CSS 都会被过滤，甚至 margin: 0 auto都不起作用），基本各大邮箱都会解析混乱，所以老式的 table 布局是上乘之选。这就意味着 HTML 邮件中几乎只有这几个元素——table / tr / td / span / img / a，尽量避免使用 div / p 或是其他标签。
而且并不是所有邮箱都支持 colspan / rowspan 属性，所以所有布局都需要使用 table 嵌套解决。
1.Doctype
目前，兼容性最好的Doctype是XHTML 1.0 Strict，事实上Gmail和Hotmail会删掉你的Doctype，换上这个Doctype。
使用这个Doctype，也就意味着，不能使用HTML5的语法。
2.布局
网页的布局（layout）必须使用表格（table）。首先，放置一个最外层的大表格，用来设置背景。
基本html
3.图片
图片是唯一可以引用的外部资源。其他的外部资源，比如样式表文件、字体文件、视频文件等，一概不能引用。
有些客户端会给图片链接加上边框，要去除边框。
需要注意的是，不少客户端默认不显示图片（比如Gmail），所以要确保即使没有图片，主要内容也能被阅读。
4.行内样式
所有的CSS规则，最好都采用行内样式。因为放置在网页头部的样式，很可能会被客户端删除。客户端对CSS规则的支持情况，请看这里。
另外，不要采用CSS的简写形式，有些客户端不支持。比如，不要写成下面这样：
如果想表达
要写成下面这样：
相关文章
HTML 邮件兼容问题与解决方案
步骤一、打开Dreamweaver编辑器步骤二、新建html并把最基本的页面属性设置一下
步骤三、插入表格并且设置表格属性
步骤四、以上例子是选择了三行，在最上面的一行里插入网站或者logo，这里可以设计一张图片第二行里可以加入你想加入的信件内容第三行里输入签名和联系信息，好啦，保存为想要的名字比如保存为：开发信模板.htm
步骤五、找到Foxmail的安装路径Foxmail\Template\New\文件夹，打开template.ini文件，照着下面的修改配置
步骤六、把做好的模板 例如开发信模板.htm 放到如图所示路径下面
步骤七、返回到foxmail信纸管理，看到（自己命名的）开发信模板了吧，选中这个，然后把这个设为默认。
以QQ邮箱为例，
首先把要显示的内容用编辑器编辑好，然后打开QQ邮箱，点击写信，出现如下界面
然后点击正文编辑工具最右边的“格式”,会弹出一个工具条，如下图：
再点击弹出的工具条中最右边的 代码符号 “</>”，即可显示代码编辑区域
然后将之前编好的html邮件代码复制粘贴到该处，点击返回可视化编辑浏览效果，最后进行相应调整即可
