基本要求
- 不要div，只用table布局，div會(huì)被當(dāng)做垃圾郵件
- 不要用背景圖，用img，某些郵箱不支持背景圖
- 不要用margin調(diào)節(jié)左右邊距，用padding，某些郵箱不支持左右margin
- 標(biāo)簽之間不要留空隙，直接壓縮html，否則某些有些會(huì)解析空隙
- 不要用link，所有樣式都要行內(nèi)，所以也就沒有@media等等等
- 不能用腳本
- 不要用margin: 0 auto居中，對(duì)齊方式靠td的align和valign屬性
- 子級(jí)不要用百分比寬度，寬度寫死
- 不要用line-height撐高度，比如有一行文字，通常直接一個(gè)line-height就達(dá)到撐高度和居中的效果了，但是在郵箱里必須設(shè)置height，最好加上max-height，某些郵箱會(huì)把height解析成min-height
- 不要用任何CSS3屬性，所有屬性都用你能想到的兼容性最好的屬性
- 不要用float、position之類的布局，都用table布局，可以用table或td的align、valign
響應(yīng)式EDM
可以利用浮動(dòng)元素寬度不夠會(huì)掉下去的思路做響應(yīng)式。無非就是需求里有一條類似，寬度足夠時(shí)4列布局，不夠時(shí)兩列布局這種。再?gòu)?fù)雜的響應(yīng)式做不到，畢竟不支持CSS3
但是EDM最好不要用浮動(dòng)，所以利用table標(biāo)簽的align屬性，align屬性的行為和浮動(dòng)一樣。
方法：
在百分比寬度的盒子里放兩個(gè)align="left"的table元素，寬度不夠時(shí)會(huì)像浮動(dòng)元素一樣掉下去。但是建議不要用百分比寬度，所以直接寫兩個(gè)table元素，不用任何元素包裹，瀏覽器窗口就是所謂的百分比寬度的盒子。
比如上面的例子，分4列和2列布局，那么就寫兩個(gè)table一個(gè)table里寫兩個(gè)列，當(dāng)瀏覽器窗口寬度不夠時(shí)，裝著兩列的table會(huì)掉下去，并向左對(duì)齊，形成兩列布局。
