如何在 Outlook HTML 电子邮件的表格之间添加空格？答案

【问题标题】：How to add space in between tables for an Outlook HTML email?如何在 Outlook HTML 电子邮件的表格之间添加空格？
【发布时间】：2015-05-03 00:45:41
【问题描述】：

如何解决此 Outlook HTML 电子邮件问题？它显示我的 tables 和 tds 之间的差距很大

我的代码：

<table style="table-layout: fixed;" class="w410" width="410" align="center" cellpadding="0" cellspacing="0" border="0">
      <tr style="border-collapse:collapse;" >
          <td class="main-event" height="39" valign="top" align="center" colspan="" style="font-family:'HelveticaNeue-Light', 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, 'Lucida Grande', sans-serif;border-collapse:collapse; mso-table-lspace:0;mso-tablerspace:0;" >                                         
              <p align="center" style="margin-bottom: 1em"><span id="exhibitors" style="font-family:'Myriad Pro', Verdana, Georgia; font-size:30px; line-height: 30px; font-style:bold; color:#0054a4; text-decoration: none !important; "><strong>65 Exhibitors<br />
              Already Signed Up <br />
              and Counting........</strong></span><br />
          </td>
     </tr>
     <tr style="border-collapse:collapse;" >
          <td class="main-event" height="20" valign="top" align="center" colspan="" style="font-family:'HelveticaNeue-Light', 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, 'Lucida Grande', sans-serif;border-collapse:collapse;padding:0 0 0 0; mso-table-lspace:0;mso-tablerspace:0;" >   
                 <a href="http://" id="exhibitorlist" target="_blank" style="font-family:'Myriad Pro', Verdana, Georgia; font-size:20px; line-height: 20px; font-style:bold; color:#0e1b8d;; text-decoration: underline !important;"><u>Click Here For The Exhibitor List</u></a>
          </p>
          </td>
      </tr>
</table>

<table style="table-layout: fixed;" class="w410" width="410" align="center" cellpadding="0" cellspacing="0" border="0">
    <tr style="border-collapse:collapse;" >
                       <td valign="top" align="center" style="font-family:'HelveticaNeue-Light', 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, 'Lucida Grande', sans-serif;border-collapse:collapse; padding:0 0 0 0; mso-table-lspace:0;mso-tablerspace:0;" ><a href="http://www." target="_blank"><img src="http://www" "alt="Register Now;" border="0" width="269" align="center" style="outline-style:none;text-decoration:none;display:block;"/></a>
               </td>
             </tr>
          </table>                                           
      </td>
   </tr>

     </table>                
             </td>
            </tr>
    </table>

    </td></tr>
    </table> 

    </td>

</tr>
</table>

【问题讨论】：

请考虑重新提出您的问题。

标签： css html-table outlook html-email

【解决方案1】：

这有点乱，不是吗？

电子邮件 HTML 不是普通的 HTML，参见（例如）：

http://templates.mailchimp.com

【讨论】：

【解决方案2】：

你可以简单地使用border-collapse：

table { /* Will apply to all tables */
    border-spacing: 0;
    /* OR border-collapse: collapse; */
}

或者在你的html中

<table cellspacing="0">

希望有帮助

【讨论】：