responsive EDM HTML的编写注意事项

邮件EDM趋向于历史HTML的写法，越简单越明了，采用table布局，采用style属性编写样式。

大部分童鞋大概已经忘了table的写法了，因此笔者加入部分我认为比较重要的responsive EDM与table相关的笔记。

具体的注意事项：

1.无DOCTYPE,电子邮件会自动删除代码中的doctype声明；

2.bgcolor可以不需要"#",不能写#06c,要写成6位#0066cc;

3.table的cellpadding,cellspacing指的是单元格的padding and margin;

4.做responsive的时候，两列布局考虑用两个table，间距用table定义，记得给间距table同时定义width和height才可显示;或者用td，加上class="float",responsive样式写为

@media only screen and (max-width:480px) {
		  .float{
		     display:block;
		     float:left;
		     width:100%;
		  }
		}

另外，IE8不支持media query;如果想要用media query的话，要用相关的media query的js，当然，EDM支持js的话，不知道猴年马月了。

5.我们内容有15px的间距，我们使用一个空的单元格来制作这个间距。这个空格没有问题，但最好在单元格中添加一个空白的符号 

6.对于table的align="left",align="right",表示给tabe加上float属性;在EDM邮件客户端中，会默认删除邮件HTML中的posiiton,float属性，所以对于响应式邮件的设计，两列布局用table时，可使用此方法间接使用float,定位两列在一行上;

7.图片请使用绝对路径，因为页面和图片文件肯定不是在一起的，发送邮件的时候，以HTML代码形式发送，无法调用相对路径的图片；

8.有些邮件客户端不支持背景图片，非要使用背景图片的，请添加bgcolor，保证无法显示图片的情况仍有背景；

9.中的内容几乎会被客户端删除，所以在head中的对于一些客户端是没有用的；

10.不建议使用colspan,rowspan合并单元格的属性，很容易天下大乱的；要不就直接内部添加一个新的table表格；

11.很多标签请慎用，在outlook上邮件的兼容甚至于比IE4,5还差，忘了标签语义化吧，用样式代替；

响应式responsive:

要做响应式的EDM，记得给head标签加上如下meta：

为了兼容IOS，记得要重置body标签，

重置table标签，不同的项目不同处理，但border,cellpadding,cellspacing一定要重置

其中的class="full"是我设置的一个width:100%!important;属性

 在宽度小于600px的时候让其宽度100%自适应； 
   
记得给