我正在创建一个由切片图像组成的电子邮件签名。这是图像应该如何组合在一起:
代码如下:
<table width="406" height="136" border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse;">
<tr>
<td colspan="4" height="82">
<img src="img/Rectangle_1.png" width="406" height="82" alt="" style="display: block;"></td>
</tr>
<tr>
<td rowspan="2" height="54">
<img src="img/Rectangle_2.png" width="25" height="54" alt="" style="display: block;"></td>
<td height="40">
<a href="#"><img src="img/Rectangle_3.png" width="134" height="40" alt="" style="display: block; border:0; outline: none; text-decoration: none;"></a></td>
<td height="40">
<a href="#"><img src="img/Rectangle_4.png" width="125" height="40" alt="" style="display: block; border:0; outline: none; text-decoration: none;"></a></td>
<td rowspan="2" height="54">
<img src="img/Rectangle_5.png" width="122" height="54" alt="" style="display: block;"></td>
</tr>
<tr>
<td colspan="2" height="14" style="line-height: 14px;">
<img src="img/Rectangle_6.png" width="259" height="14" alt="" style="display: block;"></td>
</tr>
</table>
除了 Office365(在任何浏览器中),这在几乎所有邮件客户端中都能完美呈现。查看所有客户端/浏览器的屏幕截图 https://www.emailonacid.com/app/acidtest/viewresult/tUjH3Kk7JSzaD5D0F6X2agbPFHRkUvVfkGetyDv2hMgll .下面的屏幕截图显示了 IE11 中的 Office365。
我似乎无法修复这个空白问题,也无法修复链接图像周围的轮廓。我已经尝试了此处列出的两个修复程序 http://www.emailonacid.com/blog/details/C13/two_fixes_for_image_spacing_in_outlook_web_app_owa但他们都没有工作。 align="left"
在 Office365 的 Chrome 和 Firefox 中修复了它,但它在其他浏览器中仍然损坏,而且它破坏了许多其他客户端的布局。 div
修复的情况与此类似。请在此处查看所有左对齐“修复”的客户端/浏览器的屏幕截图 https://www.emailonacid.com/app/acidtest/viewresult/SyapFGGm5JKUgTdZEs6L7oqlmHLOuQqMcFQGM307uA7LH
有谁知道如何在不给其他客户端/浏览器带来问题的情况下解决这个问题?
非常感谢
最佳答案
在使用图片的时候还需要使用align=规则去掉owa中的空格
这是一个巨大的痛苦
<img src="img/Rectangle_2.png" width="25" height="54" alt="" align="center" style="display: block;">
如果只是纯色,你应该坚持使用表格的背景色
关于HTML 电子邮件 Office 365 (OWA) 表格呈现错误,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25292738/