問題在我的HTML/CSS電子郵件

我知道，當我來到HTML電子郵件我必須使用表格佈局。這就是我所做的here不幸的是，當我使用這個online tool對我的Hotmail和Gmail進行一些測試時，佈局並不完全相同。在電子郵件中，與我的HTML code的不同之處在於它不會在文本<h2>"Responda correctamente a las preguntas y gane un viaje a Roma!"</h2>中獲得相同的H2字體樣式和族，並且第二個圖像與頂部和底部的圖像是分開的。找出問題的最佳解決方案是什麼？我怎樣才能達到相同的佈局？問題在我的HTML/CSS電子郵件

感謝您的時間

來源

2012-09-27 Koala7

有你需要一噸的東西做一個HTML電子郵件vs一個普通的HTML頁面做不同，這裏有一些見解：http://www.catswhocode.com/blog/best-practices-for-coding-html-emails – TheZ

另一個非常重要的事情是沒有沒有換行符的大段文字。嘗試使每行的最大字符數爲65，並打破所有行。一些電子郵件服務器和客戶端在某些行長度處撕裂/刪除某些字符，從而破壞了您的佈局。 – rcdmk

不要依賴於外部（<link rel="stylesheet">）或嵌入樣式表（載於<style>標籤<body>上面的標籤內）。這是要避免的最重要的事情。許多電子郵件服務會切斷身體標記上方的所有內容並禁用外部樣式表也就是說你可以包含一些嵌入的CSS語句（比如鏈接顏色），只要你確定它們不在某些電子郵件客戶端中呈現即可。

味道這篇文章：http://groundwire.org/labs/email-publishing/using-css-and-html-in-email-newsletters

來源

2012-09-27 16:37:04 yckart

好吧，我已經使用這個工具http://premailer.dialect.ca/不依賴任何外部的CSS表，並使電子郵件服務閱讀正好在我的身體下。我得到了一個更好的結果！但它仍然不完全一樣:( – Koala7

嘗試添加style="display:block;"您所有的img標籤和代替H2使用了樣式屬性的字體標籤：

<font style="color:#202020; font-family: 'Georgia',serif; font-size: 14px; line-height: 20px;"> 
    <b>Some title</b> 
</font> 
<br>

來源

2012-09-27 17:12:25

我非常接近實現它，這是我的新代碼http://jsbin.com/opokac/1/edit由premailer.dialect.ca生成，但外觀不是靜止的相同的區別非常接近。好得多，但不是一樣的。我添加了style =「display：block」，但它更糟糕 – Koala7

問題在我的HTML/CSS電子郵件

回答

相關問題