1能用属性就不要用样式
比如<img style="width:100px;height:100px">改写成<img width="100" height="100">
width height bgcolor valign align... 建议属性和样式两个都写上
2所有行内样式单独指定并且尽量不要简写,如果你不考虑outlook低版本的话,请随意
虽然继承规则仍然有效,但是邮箱的默认规则仍会对邮件产生影响,比如font-family,尽可能不用依赖继承
尽量不要简写 如<p style="margin:20px 0">改成<p style="margin-top:20px;margin-bottom:20px;">
3背景
style内部的background可以设置color但是image会被过滤,不能用css设置背景图
有一个特殊属性<td background=""></td>
background="" 可定义图片路径 ***但无法对图片进行定位
建议尽量不要是使用 并且style内部的background优先级要比它更高,同时写的时候会覆盖
4指定图片的width和height
有些邮箱的图片不是默认加载的 ,需要用户的许可,比如Outlook2015
指定宽高能保证在图片没有撑出前保证邮件良好的结构 (width height属性后一定不要加单位***outlook的一些版本无法识别)
5margin与padding在outlook2007-2013不支持 可用vspace hspace代替
6color与bgcolor等不要简写
style="color:#999" 要写成style="color:#999999" 六位都写全
7行高
a.
outlook会有行高默认最小值
如果 line-height 设置的值小于默认的行高,无论你设置的是多少,则始终使用默认值
使用line-height-rule:exactly;解决
<td style="line-height-rule:exactly;line-height:30px;'></td>
***该属性只放在“块级”元素上有效,span font等行内元素会使其不能垂直居中
b.
注意font与line-height的顺序
如 line-height:30px; font:bold 12px; line-height不会生效
改成 font:bold 12px;line-height:30px;
遇到过的问题和解决方法
1腾讯企业邮箱 (pc端)
字体font-family:Microsoft YaHei, arial, sans-serif;不要写成font-family:'微软雅黑'
在a标签中会有编码问题影响a标签的其它样式
2阿里企业邮箱(pc端)
空白占位标签就算给了高度也会变成height:auto; 可以再添加一个 min-height 和display:block解决
空白占位标签<td height="20" style="min-height:20px;display:block;"></td>