Gmail中添加了一个空白，位于Outlook的HTML签名中
问题描述：
我创建了一个我需要在Outlook中使用的html签名。根据建议，我使用了表格布局，给定了所有图像，甚至是td，tr和表格本身的特定高度和宽度，0填充和边距，甚至尝试在css和旧式方式中添加这些实际的标签。
在outlook中，它出来的不错，但是在gmail中它增加了tr之间的差距。 按照这里的建议：Gmail displaying gaps between images，我试着添加style =“display：block;”到图像，仍然没有运气。 这里是我使用的代码：Gmail中添加了一个空白，位于Outlook的HTML签名中
<table cellspacing="0px" cellpadding="0px" border="0px" width="592px" height="254px" style="border-collapse:collapse; border:none; padding:0px; margin:0px; width:592px; height:254px;">
<tr cellspacing="0px" cellpadding="0px" width="592px" height="90px" style="padding:0px; margin:0px; width:592px; height:90px;">
<td cellspacing="0px" cellpadding="0px" width="83px" height="90px" style="padding:0px; margin:0px; width:83px; height:90px;"> </td>
<td cellspacing="0px" cellpadding="0px" width="150px" height="90px" style="padding:0px; margin:0px; width:150px; height:90px;"><img src="new_sig.files/sig2.png" width="150px" height="90px"></td>
<td cellspacing="0px" cellpadding="0px" width="359px" height="90px" style="padding:0px; margin:0px; width:359px; height:90px;"><img src="new_sig.files/sig3.png" width="359px" height="90px"></td>
</tr>
<tr cellspacing="0px" cellpadding="0px" width="592px" height="64px" style="padding:0px; margin:0px; width:592px; height:64px;">
<td cellspacing="0px" cellpadding="0px" width="83px" height="64px" style="padding:0px; margin:0px; width:83px; height:64px;"><a href="http://www.facebook.com"><img style="border:none;" src="new_sig.files/sig4.png" width="83px" height="64px"></a></td>
<td cellspacing="0px" cellpadding="0px" width="150px" height="64px" style="padding:0px; margin:0px; width:150px; height:64px;"><img src="new_sig.files/sig5.png" width="150px" height="64px"></td>
<td cellspacing="0px" cellpadding="0px" width="359px" height="64px" style="padding:0px; margin:0px; width:359px; height:64px;"><img src="new_sig.files/sig6.png" width="359px" height="64px"></td>
</tr>
<tr cellspacing="0px" cellpadding="0px" width="592px" height="100px" style="padding:0px; margin:0px; width:592px; height:100px;">
<td cellspacing="0px" cellpadding="0px" width="83px" height="100px" style="padding:0px; margin:0px; width:83px; height:100px;"><img src="new_sig.files/sig7.png" width="83px" height="100px"></td>
<td cellspacing="0px" cellpadding="0px" width="150px" height="100px" style="padding:0px; margin:0px; width:150px; height:100px;"><img src="new_sig.files/sig8.png" width="150px" height="100px"></td>
<td cellspacing="0px" style="padding:0px 5px 0px 15px; margin:0px; width:339px; height:100px;line-height:16px; font-size:12px;color:#4f4f4f;font-family:arial;" >
Name LastName<br/>
Description<br/><br/>
<a href="http://www.site.com" style="color:#0875a4;">www.site.com</a>
<img src="new_sig.files/phone_icon.png" width="18px" height="28px"/>
972-(0)3-6960556
<img src="new_sig.files/mail_icon.png" width="18px" height="28px"/>
<a href="mailto:[email protected]" style="color:#0875a4;">[email protected]</a>
</td>
</tr>
</table>
现在，代码的Gmail读取，显然是这样的：
<table width="592" cellspacing="0" cellpadding="0" border="0" style="width: 444pt; border-collapse: collapse;">
<tbody>
<tr style="min-height: 67.5pt;">
<td width="83" style="width: 62.25pt; padding: 0in; min-height: 67.5pt;">
<p class="MsoNormal"><span style="font-size: 12pt; font-family: "Times New Roman","serif";"> </span></p>
</td>
<td width="150" style="width: 112.5pt; padding: 0in; min-height: 67.5pt;">
<p class="MsoNormal"><span style="font-size: 12pt; font-family: "Times New Roman","serif";">
<img height="90" width="150" src=""></span><span style="font-size: 12pt; font-family: "Times New Roman","serif";"></span></p></td>
<td width="359" style="width: 269.25pt; padding: 0in; min-height: 67.5pt;">
<p class="MsoNormal"><span style="font-size: 12pt; font-family: "Times New Roman","serif";">
<img height="90" width="359" src=""></span><span style="font-size: 12pt; font-family: "Times New Roman","serif";"></span></p></td></tr>
<tr style="min-height: 48pt;">
<td width="83" style="width: 62.25pt; padding: 0in; min-height: 48pt;">
<p class="MsoNormal"><a target="_blank" href="http://www.facebook.com/"><span style="font-size: 12pt; font-family: "Times New Roman","serif"; color: blue; text-decoration: none;">
<img height="64" width="83" border="0" src=""></span></a><span style="font-size: 12pt; font-family: "Times New Roman","serif";"></span></p></td><td width="150" style="width: 112.5pt; padding: 0in; min-height: 48pt;"><p class="MsoNormal"><span style="font-size: 12pt; font-family: "Times New Roman","serif";">
<img height="64" width="150" border="0" src=""></span><span style="font-size: 12pt; font-family: "Times New Roman","serif";"></span></p></td>
<td width="359" style="width: 269.25pt; padding: 0in; min-height: 48pt;"><p class="MsoNormal"><span style="font-size: 12pt; font-family: "Times New Roman","serif";">
<img height="64" width="359" border="0" src=""></span><span style="font-size: 12pt; font-family: "Times New Roman","serif";"></span></p></td></tr>
<tr style="min-height: 75pt;">
<td width="83" style="width: 62.25pt; padding: 0in; min-height: 75pt;">
<p class="MsoNormal"><span style="font-size: 12pt; font-family: "Times New Roman","serif";">
<img height="100" width="83" border="0" src=""></span><span style="font-size: 12pt; font-family: "Times New Roman","serif";"></span></p></td>
<td width="150" style="width: 112.5pt; padding: 0in; min-height: 75pt;">
<p class="MsoNormal"><span style="font-size: 12pt; font-family: "Times New Roman","serif";">
<img height="100" width="150" border="0" src=""></span><span style="font-size: 12pt; font-family: "Times New Roman","serif";"></span></p></td>
<td width="339" style="width: 254.25pt; padding: 0in 3.75pt 0in 11.25pt; min-height: 75pt;">
<p style="line-height: 12pt;" class="MsoNormal"><span style="font-size: 9pt; color: rgb(79, 79, 79);">Name LastName<br>Description<br><br><a target="_blank" href="http://www.site.com">
<span style="color: rgb(8, 117, 164);">www.site.com</span></a> </span>
<span style="font-size: 9pt; color: rgb(79, 79, 79);">
<img height="28" width="18" border="0" src=""></span>
<span style="font-size: 9pt; color: rgb(79, 79, 79);">972-(0)3-6960556 </span>
<span style="font-size: 9pt; color: rgb(79, 79, 79);">
<img height="28" width="18" border="0" src=""></span>
<span style="font-size: 9pt; color: rgb(79, 79, 79);">
<a target="_blank" href="mailto:[email protected]">
<span style="color: rgb(8, 117, 164);">[email protected]</span></a> </span></p></td></tr>
</tbody></table>
我试着也给人0整个表行高，但也没有工作。
由于某种原因，最后一个单元格中的2个图像btw不会显示在gmail中。
更新：没有真正注意到这个收到更多的答案，直到现在。我们最终简化了设计/代码，并在一段时间后停止检查此页面。不知道这里的解决方案是否有效，但我看到他们帮助了其他人。 thnx无论如何:)
答
嗯，我不能通过发送电子邮件到我的Gmail帐户复制问题，但我确实在Opera浏览器中检查HTML时看到了问题。
尝试将vertical-align: middle;添加到有问题的<TD>。它为Opera做了诀窍。
也就是说，没有看到图像，但垂直对齐不应该制动任何东西。
你可能也想看看这个工具： http://www.emailonacid.com/
免费版本允许你检查AOL网站，Gmail和Outlook 2003中
答
尝试在头部放置这样的：
<style type="text/css">
<!--
p.MsoNormal {
margin: 0px !important;
}
-->
</style>
它应该覆盖不愿在Gmail中出现的样式。
答
对于只包含一个图像，行高设置为0
<td style="line-height:0"><img ... /></td>
表格单元格（电子邮件酸性是一个很好的提示。）
+2
嗨，谢谢！您的评论帮助我解决了问题 – 2011-07-30 21:40:01
+0
大的帮助。谢谢！ – ObjectType 2011-11-10 18:15:54
+1
谢谢！为我的救命稻草。非常感激。 – 2012-06-20 22:13:38
答
你提到你尝试添加样式=”显示：阻止“你的图像，但我没有看到你的代码中。几件事情在Gmail中固定这些情况对我来说：
- 添加边框=“0”和风格=“显示：块”到每一个元素
- 当指定的属性，宽度和高度（而不是在“风格”属性）不包括“PX”，只是数量
所以，如果你确保所有的图像都在下面的格式应该删除这些差距（假设他们不是由不正确的放在那里高度值）。
<img alt="something" src="http://somewhere.com/image.png" width="35" height="35" border="0" style="display:block;" />
答
解决方案为我是我总结了这里
不喜欢的东西给每一个解决方案：
<td rowspan="2" style="line-height:0">
<img src="images/myimage.jpg" width="426" height="183" alt=""border="0" style="display:block;" />
</td>
，它为我工作得很好......
它确实在萤火虫中解决问题，但是当我通过outlook再次发送它时，出于某种原因删除了垂直对齐。我刚刚尝试添加valign td，它也将其删除.. – AnnaC 2011-03-10 09:10:54