HTML电子邮件，删除tr标记之间的间距？_Html_Css_Email

HTML电子邮件，删除tr标记之间的间距？

html css email

HTML电子邮件，删除tr标记之间的间距？,html,css,email,Html,Css,Email,我已尝试添加cellspacing=“0”cellpadding=“0”。无法修复电子邮件客户端中的问题以下是gmail中的间距图像： HTML: Openx网络研讨会有没有关于如何解决这个问题的建议？注意：这是用于HTML电子邮件的更新的标题代码： <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <

我已尝试添加cellspacing=“0”cellpadding=“0”。无法修复电子邮件客户端中的问题

以下是gmail中的间距图像：

HTML:


Openx网络研讨会

有没有关于如何解决这个问题的建议？注意：这是用于HTML电子邮件的

更新的标题代码：

    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <title>Openx Webinar</title>
    <style type="text/css">
    div, p, a, li, td { -webkit-text-size-adjust:none; }
    </style> 
</head>
<body>
    <div style="margin:0;padding:0;font-family:Arial,Helvetica,sans-serif">
    <table align="center" width="600" cellspacing="0" cellpadding="0" style="font-family:Arial,Helvetica,sans-serif" >
        <!-- Header -->
        <thead>
            <tr>
                <td id="header" width="600" valign="top" align="left">
                    <img src="http://openx.dev.limusdesign.com/emails/webinar/images/header.png" alt="OpenX Webinar Series" height="65" style="display:block">
                </td>
            </tr>
            <tr>
                <td id="banner" width="600" valign="top" align="left">
                    <img src="http://openx.dev.limusdesign.com/emails/webinar/images/banner.png" alt="Banner Image" height="180" style="display:block">
                </td>
            </tr>
            <tr>
                <td width="600" height="20" valign="top" align="left"></td> 
            </tr>   
        </thead>
    </table>
    </div>
</body>
</html>


Openx网络研讨会
div，p，a，li，td{-webkit文本大小调整：无；}

通过向图像添加

style=“display:block”

修复了该问题

您可以更改包含第一个图像的

的显示选项：

thead tr:first-child td
{
  display: block;
  height:65px;
}

或者是img本身

thead tr:first-child td img
{
display: block;
}

将代码更改为：

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
  <title>Openx Webinar</title>
</head>
<body>
  <div style="padding:0;font-family:Arial,Helvetica,sans-serif">
    <table align="center" width="600" cellspacing="0" cellpadding="0" border="0" style="font-family:Arial,Helvetica,sans-serif" >
      <tr>
        <td id="header" width="600" valign="top" align="left" style="padding:0px;outline:none;border:none;">
        <img src="http://openx.dev.limusdesign.com/emails/webinar/images/header.png" alt="OpenX Webinar Series" style="padding:0px;outline:none;border:none;"/>
        </td>
      </tr>
      <tr>
        <td id="banner" width="600" valign="top" align="left" style="padding:0px;outline:none;border:none;">
        <img src="http://openx.dev.limusdesign.com/emails/webinar/images/banner.png" alt="Banner Image" style="padding:0px;outline:none;border:none;">
        </td>
      </tr>
      <tr>
        <td width="600" height="20" valign="top" align="left"></td> 
      </tr>   
    </table>
  </div>
</body>
</html>


Openx网络研讨会

首先，将您的表格放在另一张宽度设置为100%的表格中

内桌设置为600，且位于中间，可容纳所有内容

您不再需要在每个td上设置宽度或对齐。你的邮件太多了

街区工作。瓦林·托普也是

得到更好的结果

对不起，把Div处理掉。表就是这样。

不要使用类

细胞填充和细胞间隔是炸药和火炬。你要把东西炸了

要删除tr标记之间的空间，只需添加边框折叠：collapse；到你的桌子标签。与电子邮件中的表格类似，您可以将其添加为：

<table style="border-collapse: collapse;">

您没有结束表或正确的结束html标记。首先修复该问题。不要关闭

标记添加了关闭表和div标记。还是没修好首先验证您的代码。另外，我猜是边框折叠，但一旦你的代码有效，我会测试它。

margins

不适用于所有电子邮件客户端，最好还是使用填充。

<table style="border-collapse: collapse;">