簽名沒有表現出如預期

我已經創建了一個HTML簽名簽名沒有表現出如預期

<html> 

<head> 
<style type="text/css"> 
#acc { 
width:700px; 
margin-top: 5px; 
border-top: solid red 1px; 
padding-top:5px; 
overflow:hidden; 
} 
#last{ 
float:right; 
margin-top: 1px; 
} 
#blast{ 
margin-left: 10px; 
} 
#second{ 

} 
#main{ 
width:700px; 
height:300px; 
} 
#logo{ 
z-index:50; 
position:absolute; 
top:50px; 
} 
#bg{ 
z-index:1; 
} 
#green{ 
color:green; 
margin-bottom:10px; 
} 
#footer{ 
margin-top:10px; 
width:700px; 
font-size:12px; 
color:gray; 
} 
</style> 
</head> 

<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0"> 
<!-- Save for Web Slices (Untitled-1) --> 
<div id="main"> 
<a href="http://romero.group"><img id="bg" src="https://i.gyazo.com/86c63547132c53e29202725bb83381a1.png" width="700" height="230" alt=""></a> 



<div id="acc"> 
<img src="http://www.manorsidejoinery.co.uk/wp-content/uploads/2017/02/CHAS-acreddited-contractor.jpg" width="220" height="140" alt=""> 
<img id="second" src="https://www.buildingcentre.co.uk/system/images/images/000/066/507/original/Worksafe-contractor-Log1.jpg?1455634903" width="220" height="140" alt=""> 
<img id="blast" src="https://i.gyazo.com/8b787ac125b5ebad1a75b620a86346df.png" width="110" height="140" alt=""> 
<img id="last" src="https://i.gyazo.com/c3d58119498dcc3223b1bf20070f6f4b.jpg" width="110" height="140" alt=""> 
</div> 
<div id="footer"> 
<div id="green"><img src="https://i.gyazo.com/cde8ee05016520b0c7a753954c6a887e.png">Please consider the environment before printing this email message.</div> 
This E-mail and any attachments are intended only for the individual or company to which it is addressed and any may contain information which is privileged, confidential and prohibited from disclosure or unauthorized use under applicable law. If you have received this email by mistake please notify <a href="mailto:[email protected]" target="_top">[email protected]</a> immediately. 
</br></br> 
Romero Interiors is a Limited company registered in England and Wales | Registration number: 06923001 | Registered office: Solar House, 282 Chase Road, London, N14 6NZ 
</div> 
<!-- End Save for Web Slices --> 
</body> 
</html>

當我測試它在我的瀏覽器，它出來像預期一樣：

它來按照我的電子郵件的意圖，當我通過電子郵件發送到我的Hotmail時，它工作得很好。

不幸的前景時，人會收到一封電子郵件簽名被搞砸了，它看起來像這樣2016年

任何人有，爲什麼它會顯示不同的面貌任何想法只？正如你所看到的那樣，紅色邊框和它下面的文本都跳出了框框，最後一張認證圖像沒有像預期的那樣浮動。

來源

2017-10-13 Exsedor

感謝您的評論！這是由photoshop最初生成的，因爲我將圖像保存爲網頁。這不是問題，問題是紅色的邊框，下面的文字都出現在div框外面。 – Exsedor

對於電子郵件模板，建議您使用表格而不是div。我會推薦使用https://litmus.com/等電子郵件工具，它可以讓您測試各種電子郵件客戶端的電子郵件代碼。 – heady12

嗨Heady12謝謝你的回覆！我嘗試過使用表格，但是當我這樣做時，最終會在行和列之間出現白線。像這樣例如：https://gyazo.com/8cb1c549f3be1be6759a1655a18cd0f3 – Exsedor

不幸的是，這些類型的奇怪問題在不同的網絡郵件/電子郵件提供商和嵌入式內容中很常見。您應該明白，即使您使用Outlook 2016解決了此問題，您可能會遇到與其他服務有關的問題，或者您的修補程序甚至可能會在將來突然停止工作（如果/當服務提供商對其代碼進行更改時）。

這樣說，似乎可能有一個與展望2016年的錯誤，其中您的保證金聲明需要有一個大寫字母'M'，以便他們能夠正常工作（請參閱此文檔以供參考：https://www.emailonacid.com/blog/article/email-development/tips_and_tricks_outlook.com）。

此外，應用於div的浮動寬度和位置CSS樣式在Outlook中不起作用。您可能想嘗試使用表格。

祝你好運！

來源

2017-10-13 09:54:21 Jaxian

非常感謝您的回覆！我現在會測試這個！仍然沒有解釋爲什麼內容跳出了div？ – Exsedor

簽名沒有表現出如預期

回答

相關問題