签名没有表现出如预期

我已经创建了一个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

签名没有表现出如预期

回答

相关问题