为什么在HTML电子邮件中这些块之间有一个空白

Question

因此，这个问题只出现在客户端时，他们发送电子邮件，而不是在我的一端，当设计它。我要用Dreamweaver来做这部分。它就是这样出现的-

​

​

这是我对本节的代码。顶部是白色块，两侧是蓝色，底部是纯蓝色。此问题仅在客户端部署电子邮件时才会出现。

​

<table border="0" cellpadding="0" cellspacing="0" width="100%">
  <tr>
    <td class="hide" width="20">
      <table border="0" cellpadding="0" cellspacing="0" width="100%">
        <tr>
          <td height="39" bgcolor="#3A99A8">
            <table border="0" cellpadding="0" cellspacing="0" width="100%">
              <tr>
                <td style="font-size: 0; line-height: 0;">&nbsp;</td>
              </tr>
            </table>
          </td>
        </tr>
      </table>
    </td>
    <td class="sideline" width="198">
      <table border="0" cellpadding="0" cellspacing="0" width="100%">
        <tr>
          <td height="19">
            <table border="0" cellpadding="0" cellspacing="0" width="100%">
              <tr>
                <td style="font-size: 0; line-height: 0;">&nbsp;</td>
              </tr>
            </table>
          </td>
        </tr>
        <tr>
          <td height="20" bgcolor="#3A99A8">
            <table border="0" cellpadding="0" cellspacing="0" width="100%">
              <tr>
                <td style="font-size: 0; line-height: 0;">&nbsp;</td>
              </tr>
            </table>
          </td>
        </tr>
      </table>
    </td>
    <td width="160" bgcolor="#00558A">
      <table border="0" cellpadding="0" cellspacing="0" width="100%">
        <tr>
          <td align="center" valign="top">
            <table border="0" cellpadding="0" cellspacing="0">
              <tr>
                <td>
                  <table border="0" cellspacing="0" cellpadding="0">
                    <tr>
                      <td align="center" bgcolor="#00558A">
                        <a href="https://www.clubmed.us/l/revisedcancellationpolicy" target="_blank" style="font-family: 'Happiness', 'Trebuchet MS', Helvetica, Arial, sans-serif !important; color: #ffffff; font-size: 13px; font-weight: bold; padding: 10px 20px; border: 0; border-radius: 0; display: inline-block; text-transform: uppercase; text-decoration: none;">
                                                                            Learn more&nbsp;&nbsp;&#62;</a>
                      </td>
                    </tr>
                  </table>
                </td>
              </tr>
            </table>
          </td>
        </tr>
      </table>
    </td>
    <td class="sideline" width="198">
      <table border="0" cellpadding="0" cellspacing="0" width="100%">
        <tr>
          <td height="19">
            <table border="0" cellpadding="0" cellspacing="0" width="100%">
              <tr>
                <td style="font-size: 0; line-height: 0;">&nbsp;</td>
              </tr>
            </table>
          </td>
        </tr>
        <tr>
          <td height="20" bgcolor="#3A99A8">
            <table border="0" cellpadding="0" cellspacing="0" width="100%">
              <tr>
                <td style="font-size: 0; line-height: 0;">&nbsp;</td>
              </tr>
            </table>
          </td>
        </tr>
      </table>
    </td>
    <td class="hide" width="20">
      <table border="0" cellpadding="0" cellspacing="0" width="100%">
        <tr>
          <td height="39" bgcolor="#3A99A8">
            <table border="0" cellpadding="0" cellspacing="0" width="100%">
              <tr>
                <td style="font-size: 0; line-height: 0;">&nbsp;</td>
              </tr>
            </table>
          </td>
        </tr>
      </table>
    </td>
  </tr>
</table>

​

Answer 1

我在几个月前的outlook呈现中也遇到了同样的问题，并且能够用这段代码修复它：

<!--[if (gte mso 9)|(IE)]>
 <style type="text/css">
   table {
    border-collapse: collapse;
    border-spacing: 0;
    mso-table-lspace: 0pt !important;
    mso-table-rspace: 0pt !important; }
  </style>
 <![endif]-->

我在这里找到了这个答案：https://www.emailonacid.com/blog/article/email-development/how-to-code-emails-for-outlook-2016/

如果Outlook特定的代码不能工作，其中还有其他一些修复程序可能会有所帮助。