由於之前python那邊有一些制作前端html郵件的需求,所以在這過程中也有了一些自己的心得體會
1.
不要外聯css

所以,通過html的標簽屬性或者style屬性來設置頁面的css樣式。而在HTML電子郵件的開發中,有一條黃金法則:
如果一個屬性存在於HTML中,絕對使用標簽屬性而不使用CSS樣式。
2.
使用table布局
為什么要用古老的table布局呢?因為郵件的客戶端一般都采取比較原始的解析方式,我們可以郵件客戶端比喻為瀏覽器界的IE6。
如果采取div,再用position或float來布局的話,
由於position屬性在Outlook07/10/13、Yahoo! Mail和Google Gmail下不支持,
float屬性在Outlook客戶端和網頁端均不支持,
所以兼容性並不友好,到時在某些情況下頁面就會死得很難看。
所以,采取古老的table嵌套布局穩定性最好,而且可通過align="center"實現萬能居中
3.
所有img標簽設置alt屬性及border=0
設置alt屬性是為了防止圖片顯示不出來時,至少有文字說明,讓用戶明白意思。
設置border=0,我也不清楚為什么要設置border=0,但它確實能讓圖片在更多情況下顯示出來。
當然,在一些情況下仍然不支持,比如gmail網頁端發送到QQ郵箱網頁端(圖片仍然顯示不出來,查看源代碼發現img標簽的src和alt屬性都被和諧了)
同時,可為img設置display:block,可用來修復一些電子郵件客戶端圖片下面空白間距。
另外,如果一定要用到圖片的話,個人建議最好把圖片上傳到服務器,或者對於不大的圖片直接使用base64。
4.
設置background-color時,永遠記住要使用完整的6個完整的十六進制編碼,如果使用三個簡寫字符,不總是有效。
雖然background-color屬性對於所有郵件系統都支持,但賦值時記得用6個完整的十六進制編碼。
哪怕是黑色,也不要用#000,而是#000000
5.
用padding,不用margin
margin屬性對於Outlook的網頁端並不支持
padding可支持所有郵件系統,至少我padding用到現在並沒有出現不兼容的情況。
但我看網上說table布局的話padding是沒問題的,但如果用div布局的話padding會變得不可控,這一點我還沒有嘗試過。
這是之前做html郵件的一些心得體會,以后有其他收獲再繼續補充。