堆棧內存溢出
  簡體   English   中英

帶有鏈接圖像的HTML電子郵件在Outlook中中斷

[英]HTML email with linked images breaks in Outlook

 原文  2012-02-03 14:00:22  7   2    html/ email/ outlook/ email-client

問題描述

我用以下代碼創建了一個帶有圖像的簡單html電子郵件： 

<html>
<head>
</head>
<body style="background-color:#FFFFFF">
<div style="width: 720px; margin: 0pt auto; overflow:hidden; font-size:0; line-height:0;">
<div><img style="display:inline" src="http://img.emailnewsletter-software.net/n869_0401_3.jpg" height="176" border="0" width="720"></div>
<div><img style="display:inline" src="http://img.emailnewsletter-software.net/n869_0402_3.jpg" height="50" border="0" width="478"><a href="http://www.facebook.com/pages/Antwerp-Jewels/176579572442840" target="_blank"><img style="display:inline; border:0;" src="http://img.emailnewsletter-software.net/n869_likeButton1_3.jpg" height="50" border="0" width="165"></a><img style="display:inline" src="http://img.emailnewsletter-software.net/n869_0404_3.jpg" height="50" border="0" width="77"></div>
<div><img style="display:inline" src="http://img.emailnewsletter-software.net/n869_0405_3.jpg" height="238" border="0" width="720"></div>
<div><img style="display:inline" src="http://img.emailnewsletter-software.net/n869_0406_3.jpg" height="13" border="0" width="272"><a href="http://www.antwerpjewels.co.uk" target="_blank"><img style="display:inline; border:0;" src="http://img.emailnewsletter-software.net/n869_siteLink1_3.jpg" height="13" border="0" width="176"></a><img style="display:inline" src="http://img.emailnewsletter-software.net/n869_0408_3.jpg" height="13" border="0" width="272"></div>
<div><img style="display:inline" src="http://img.emailnewsletter-software.net/n869_0409_3.jpg" height="112" border="0" width="720"></div>
<div><img style="display:inline" src="http://img.emailnewsletter-software.net/n869_0410_3.jpg" height="27" border="0" width="503"><a href="http://www.facebook.com/pages/Antwerp-Jewels/176579572442840" target="_blank"><img style="display:inline" src="http://img.emailnewsletter-software.net/n869_likeButton2_3.jpg" height="27" border="0" width="52"></a><img style="display:inline" src="http://img.emailnewsletter-software.net/n869_0412_3.jpg" height="27" border="0" width="165"></div>
<div><img style="display:inline" src="http://img.emailnewsletter-software.net/n869_0413_3.jpg" height="133" border="0" width="720"></div>
<div><img style="display:inline" src="http://img.emailnewsletter-software.net/n869_0414_3.jpg" height="27" border="0" width="503"><a href="http://www.facebook.com/pages/Antwerp-Jewels/176579572442840" target="_blank"><img style="display:inline" src="http://img.emailnewsletter-software.net/n869_likeButton3_3.jpg" height="27" border="0" width="52"></a><img style="display:inline" src="http://img.emailnewsletter-software.net/n869_0416_3.jpg" height="27" border="0" width="165"></div>
<div><img style="display:inline" src="http://img.emailnewsletter-software.net/n869_0417_3.jpg" height="131" border="0" width="720"></div>
<div><img style="display:inline" src="http://img.emailnewsletter-software.net/n869_0418_3.jpg" height="17" border="0" width="356"><a href="http://www.antwerpjewels.co.uk" target="_blank"><img style="display:inline" src="http://img.emailnewsletter-software.net/n869_siteLink2_3.jpg" height="17" border="0" width="162"></a><img style="display:inline" src="http://img.emailnewsletter-software.net/n869_0420_3.jpg" height="17" border="0" width="202"></div>
<div><img style="display:inline" src="http://img.emailnewsletter-software.net/n869_0421_3.jpg" height="36" border="0" width="720"></div>
<div><img style="display:inline" src="http://img.emailnewsletter-software.net/n869_0422_3.jpg" height="48" border="0" width="282"><a href="http://www.facebook.com/pages/Antwerp-Jewels/176579572442840" target="_blank"><img style="display:inline" src="http://img.emailnewsletter-software.net/n869_likeButton4_3.jpg" height="48" border="0" width="157"></a><img style="display:inline" src="http://img.emailnewsletter-software.net/n869_0424_3.jpg" height="48" border="0" width="281"></div>
<div><img style="display:inline" src="http://img.emailnewsletter-software.net/n869_0425_3.jpg" height="55" border="0" width="720"></div>
<div><img style="display:inline" src="http://img.emailnewsletter-software.net/n869_0426_3.jpg" height="15" border="0" width="256"><a href="http://www.antwerpjewels.co.uk" target="_blank"><img style="display:inline;" src="http://img.emailnewsletter-software.net/n869_siteLink3_3.jpg" height="15" border="0" width="159"></a><img style="display:inline" src="http://img.emailnewsletter-software.net/n869_0428_3.jpg" height="15" border="0" width="305"></div>
<div><img style="display:inline" src="http://img.emailnewsletter-software.net/n869_0429_3.jpg" height="42" border="0" width="720"></div>
</div>
</body>
</html>

我在Outlook中測試過的所有電子郵件客戶端中都可以正確顯示此信息！ 所有鏈接的圖像周圍都顯示不規則的空格，如下圖所示。

在此處輸入圖片說明

請幫忙！

2 個解決方案

解決方案1
 1 已采納  2012-02-06 10:28:25

可能是由Div引起的。 Outlook對DIV的處理方式與瀏覽器不同，通常使它們具有雙行間距。 嘗試改用SPAN。

解決方案2
 0  2012-02-03 19:22:38

這有點猜測，因為我沒有Outlook可以運行測試，但是請嘗試在鏈接本身上不設置邊框： 

<a href="http://www.antwerpjewels.co.uk" target="_blank" style="border: none;">

否則，請嘗試： 

<a href="http://www.antwerpjewels.co.uk" target="_blank" style="text-decoration: none;">

暫無
暫無

聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

相關問題 HTML電子郵件中斷Outlook Web App中 前景不佳的電子郵件模板 HTML電子郵件Outlook圖像顯示嵌入式塊 HTML電子郵件 - Outlook 2013中圖像之間的差距 HTML電子郵件模板圖像未顯示在Outlook和Webmail中 HTML電子郵件簽名Outlook 2016中的視網膜圖像 HTML電子郵件：MS Outlook和Gmail中未顯示圖像 在Outlook中回復/轉發HTML電子郵件會顯示隱藏的內容/中斷 HTML電子郵件圖像可以在Outlook中正常工作，但不能在Outlook.com中正常工作 Outlook中的電子郵件模板間距中斷
相關標簽
 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM