消除使用HTML

圖像之間的空白讀了一些答案這個問題後，似乎他們都沒有解決的問題。我試圖通過VerticalResponse發送和發送電子郵件，並使用html。該消息被創建爲堆疊多個圖像，每個圖像都有鏈接，但它應該看起來像一個圖像。問題在於預覽效果很好，在網頁中查看效果也很好，但電子郵件顯示會在每張圖像之間顯示空白區域。代碼見http://jsfiddle.net/xMW7N/42/。請幫忙！消除使用HTML

<body> 
    <div style="text-align: center; "> 
     <span style="font-size:8pt;"><a href="website"><img align="normal" alt="Facebook - MetricRunFest" border="0" height="126" hspace="-20" name="FB" src="https://141790a61d-custmedia.vresp.com//a091cd9b91/Top.jpg?0.7593426643870771" style="width: 600px; height: 126px;" title="Facebook - MetricRunFest" vspace="0" width="600" /></a></span><br /> 
     <span style="font-size:8pt;"><a href=website"><img align="normal" alt="Metric Runners - Online Photos" border="0" height="205" hspace="-2" name="MetricRunFest - Online Photos" src="https://141790a61d-custmedia.vresp.com//a091cd9b91/Message%20Blank.jpg?0.8384064519777894" style="width: 600px; height: 205px;" title="Metric Runners - Online Photos" vspace="0" width="600" /><br /> 
     <img align="normal" alt="website" border="0" height="127" hspace="-2" src="https://141790a61d-custmedia.vresp.com//a091cd9b91/Message%20Blank_UpsideDown%209.jpg?0.44395816628821194" style="width: 600px; height: 127px;" title="website" vspace="0" width="600" /></a></span><br />

來源

2012-11-20 Keith Levasseur

不同的瀏覽器以不同的方式處理空白區域。這是很好的1行，如果有可能寫的一切，沒有任何不必要的空格或newlines.You可以嘗試這樣的： -

<span><img src="image1.jpg"></span><span><img src="image2.jpg"></span><span><img src="image3.jpg"></span>

來源

2012-11-20 20:39:45

我不能同意這是「最好的」，以保持它在同一行，但它確實解決了一些空白的問題，當涉及到電子郵件，因爲大多數電子郵件客戶端的垃圾。 – Nix

@Nix： - 「好」比「好」好嗎？ –

我只是覺得我們有發展之間做出區分的電子郵件和網頁/人，因爲有一些奇怪的怪癖你必須解決發展中的電子郵件客戶端時 - 一個是這個奇怪的白色空間的錯誤，這是一些時間解決由一班人。 – Nix

一切我看到的HTML格式的電子郵件，並從經驗。我在做他們自己，最好的選擇是使用表格，不幸的是。它可以真正幫助解決所有佈局問題。

我建議你閱讀http://24ways.org/2009/rock-solid-html-emails了很多技巧，包括對圖像的整個部分。特別是使用img {display:block;}代替Hotmail和align，例如<img src="image.jpg" align="right">代替浮動。

不是說你必然做的那些部分錯的，但他們是很好的，一般要記住。

來源

2012-11-20 20:49:42 gotohales

種種圖像這是問題的一部分之間的斷裂的空間。另外，嘗試給圖像display: block風格。

http://jsfiddle.net/xMW7N/47/

來源

2012-11-20 20:53:43 JoshNaro

謝謝！它看起來不錯，並顯示正確，直到它在gmail結束。也許這是問題，否則它看起來很棒。 –

回答

相關問題