今天接受一个需求，将HTML网页嵌入邮件中以html形式发送出去，刚看到需求那是一头蒙。不知道该如何动手，各种搜索资料，看实例。发现为邮件创建完美的HTML正文，要求点还是蛮多的。
- 出于安全考虑，邮箱html不支持任何JavaScript脚本以及外部的CSS样式
- 使用table标签进行整体布局
1、提前需要准备知识：
- table表格相关属性
- tableCSS样式
- 整体注意开发规范
国内各主流邮箱 代表qq邮箱（pc+mobile）、163邮箱、126邮箱、sina邮箱、苹果自带邮箱
（pc+mobile）、outlook。
1.放弃外链样式和内部样式
2.能不写css3就不写
3.页面稍微复杂就尽量使用table布局
4.能不放图就不放图
5.采用渐进式开发（正常html可以使用各种“黑科技”进行兼容，在邮箱上就不一定能如愿了，所以尽量
采用渐进式而不是兼容式。）
6.标签尽量只用div与table相关标签
- 整体页面规范
1.不要用html，body等标签这些标签会被过滤。
2.如果要兼容移动端，页面宽度在360px以下，不要期望meta标签的scale，也不要期望有些移动端邮箱
软件会给你自动缩放，最好在最外围标签用max-height和min-height自我调节。
如果只要兼容pc端最好在800px以内。
3.html代码大小尽量在15kb以内（不包括图片）。
4邮件主题控制在18个字以内，避免使用特殊符号，容易产生乱码。
5.链接尽量使用a链接，直接写的链.接可能会被做垃圾邮件。
6.如果群发邮件比较多，邮件名称最好在一定数量（20w左右）的时候变变。
7.不使用类似如下敏感及带促销类的文字：免费、优惠、特惠、特价、低价、便宜、廉价、视频、赚钱、
群发、发财、致富、代开、薪水、交友、支付、商机、法宝、宝典、秘密、情报、机密、保密、绝密、
神秘、秘诀等。如果一定需要，请把敏感字做成图片。
样式不一定会继承，所以多话时间重复写以下。
8.链接地址的长度不能超过255个字符，会导致无法追踪或链接错误。
10.写上<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
2、具体内容样式注意事项
1.max-height ——qq邮箱安卓端中，图片的失效
2.margin——qq邮箱pc端中，margin不能填百分比，低版本outlook图片这个样式无效
3.padding——qq邮箱pc端中，padding不能填百分比，低版本outlook无效
4.float——outlook低版本不支持
5.position——完全不建议使用
6.background——outlook低版本与gmail不支持
7.overflow——outlook低版本不支持
8.text-overflow——outlook低版本不支持
3、尽量书写方案
1.一个td里面不要放多个图片
2.dom的居中就用align=center，宽和高就用width和height标签属性，能用标签属性就用标签属性，背景也是
3.空白分割用
4.所有图片要设置border=0
5.链接的打开方式统一为：_blank
6.table中设置border=0
7.尽量减少百分比和auto的使用
8.将样式属性拆开写，比如要用到margin的时候拆开成margin-left等
9.注意清空元素默认样式
10.无内容的标签最好写上font-size:0; height:0;width:0;line-height:0;
11.不要在行内元素，或者行内块元素中添加块级元素
12.图片名称不能含有ad字符，否则图片上传后会显示成“被过滤广告”
13.链接数量不能超过10个
14.字体一般不会给你改
5、测试
代码复制进去，正常发送邮件一样。
6、邮件要求兼容 outlook 等邮箱软件，发现很多样式都不生效。找到的模板如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title></title>
</head>
<body>
<!-- 最外层table-->
<table border="0" cellpadding="0" cellspacing="0" height="100%" width="100%" style="">
<tr>
<td align="center" valign="top">
<!-- 定宽table-->
<table border="0" cellpadding="0" cellspacing="0" width="" style="">
<tr>
<td align="center" valign=""></td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>
