简述：
工作中需要创建并发送html邮件，由于之前没有写过类似的html页面，项目中遇到不少问题，故在此记录下来。复制代码
- 不同的邮件应用渲染邮件内容的方式不一样，一部分是把页面内容作为一个
div内嵌在邮件页面内，另一部分是使用独立的<iframe>包装起来的独立页面。这个问题的结果是邮件页面只有html的<body>部分，不识别<style>标签和<script>标签，所以html邮件的样式要全部写成行内样式（重要）。 - 客户读取邮件的方式不尽相同，从客户端到浏览器再到移动端app，因此写样式时要注意适配所有平台。
- 布局使用
<table>。各种应用渲染邮件的方式千差万别，其中最有代表性的或许就是微软的outlook。不同于大部分浏览器上可以识别各种标签和样式，outlook使用word的渲染引擎，<div>+css布局在这里彻底失效，并且由于是<table>布局，定位和浮动也没有了用武之地。 - 除了使用
<table>布局外，还要注意的一点就是要进行默认样式的覆盖。不同浏览器会给某些标签添加默认样式，如果不做兼容，在这种浏览器和邮箱中显示的样式差别也相当大。由于没有外部样式，所以只能写大段的内联样式。 - 能用属性就不用样式。比如图片宽高，使用
width="20";height="30"书写，注意，通过属性控制尺寸时不要带单位！！！在outlook客户端中不支持margin和padding属性。必要时可以尝试hspace和vspace。 - 此外，由于项目需求，我在邮件中使用了富文本模板渲染，真的是徒增很多麻烦，由于只能写行内样式，富文本生成的标签样式根本不受控制，在此做出提醒。
总结：html邮件由于各种邮件应用渲染方式不同以及outlook这个独特的存在，建议大家设计时以大尺寸图片为主，减少像素级布局，填充内容不宜太灵活以免增加样式负担。
参考：