0

我一直在尝试创建一个 html 电子邮件。在 gmail 上查看时，它会显示图像之间的空格。我已经尝试了所有可以在互联网上找到的方法，但没有奏效。任何帮助，将不胜感激。下面是相同的代码。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>#</title>

<style>
    table {border-collapse:collapse;}
</style>

</head>
<body>
<table width="600" cellpadding="0" cellspacing="0" align="center" border="0">
  <tr bgcolor="#FFFFFF"><td align="center"> <font size="1" face="Arial" color="#666666">If you are unable to see this message <a href="#" target="_blank">Click Here </a></font></td></tr>
 </table>
<table cellpadding="0" cellspacing="0" style="margin:0; padding:0; border:none;" align="center" width="600" border="0">
  <tr><td><img src="images/bg-1.jpg" alt="Call: 9212612255" border="0" style="display:block; margin:0; padding:0; border:none; vertical-align:top;"/></td></tr>
   <tr><td><img src="images/bg-2.jpg" alt="We support all Microsoft windows desktop operating system all software and hardware, Networking peripherals and internet are also supported" border="0" style="display:block; margin:0; padding:0; border:none; vertical-align:top;"/></td></tr>
   <tr><td><img src="images/bg-3.jpg" border="0" alt="Computer Support By Microsoft Certified Engineers" style="display:block; margin:0; padding:0; border:none; vertical-align:top;"/></td></tr>
    <tr><td><img src="images/bg-4.jpg" border="0" alt="Support available for any desktop or laptop Branded or Non-Branded" style="display:block; margin:0; padding:0; border:none; vertical-align:top;"/></td></tr>
   <tr><td><a href="http://www.codeslab.com" target="_blank" style="border:none; text-decoration:none"><img src="images/bg-5.jpg" border="0" alt="Visit Our Website" style="display:block; margin:0; padding:0; border:none; vertical-align:top;"/></a></td></tr>
     <tr><td><img src="images/bg-6.jpg" border="0" alt="For more details mail us at info@codeslab.com" style="display:block; margin:0; padding:0; border:none; vertical-align:top;"/></td></tr>
   <tr><td><img src="images/bg-7.jpg" border="0" alt="Computer Support By Microsoft Certified Engineers" style="display:block; margin:0; padding:0; border:none; vertical-align:top;"/></td></tr>
</table>
<table cellpadding="0" cellspacing="0" align="center" width="600" border="0" style="margin:0; padding:0; border:none;">
    <tr>
       <td align="center">
           <font size="1" face="Arial" color="#666666">To unsubscribe mailing list, click <a href="http://codeslab.com/contact-us.php" target="_blank">here</a></font>
       </td>
    </tr>
</table>
</body>
</html>
4

2 回答 2

0

<img>使用 CSS 设置所有标签display: block来解决此 Gmail 显示问题是一种常见的 eDM 技术。另外，删除vertical-alignCSS。

于 2013-04-02T04:15:38.263 回答
0

这是一个很好的 HTML 电子邮件支持指南：

http://www.campaignmonitor.com/css/

如果您将img元素设置为，display: block;则该vertical-align属性不起作用。因此，请尝试display: block仅从图像中删除。

另外，请记住，一旦您对此进行更改以便它在 Gmail 中运行，它可能会在 Outlook 或 Yahoo! 中中断。或Hotmail等。所以，彻底测试。

于 2013-04-02T04:16:26.813 回答