无法正确隐藏 Outlook 2013 HTML 电子邮件中的图像答案

【问题标题】：Can not properly hide images in outlook 2013 HTML Emails无法正确隐藏 Outlook 2013 HTML 电子邮件中的图像
【发布时间】：2013-03-07 14:52:03
【问题描述】：

我在 Outlook 2013 中正确隐藏图像时遇到问题，即使它们被隐藏，它们也会在它们被隐藏的地方添加一行间距，使电子邮件看起来被拉伸。这是我想从桌面版本中隐藏的图像上的代码。

<tr style="display: none; line-height: 0; font-size: 0; height: 0; padding: 0; mso-hide: all;">
 <td width="20" style="display: none; line-height: 0; font-size: 0; height: 0; padding: 0; mso-hide: all;" class="spacer-width">
  <img class="spacer-width" src="spacer.gif" height="0" width="0" style="display: none; line-height: 0; font-size: 0; height: 0; padding: 0; mso-hide: all;" alt="" />
 </td>
 <td width="560" style="display: none; line-height: 0; font-size: 0; height: 0; padding: 0; mso-hide: all;" class="secondary-fullwidth">
  <img src="btn-8.gif" height="0" width="0" style="display: none; line-height: 0; font-size: 0; height: 0; padding: 0; mso-hide: all;" class="btn-two" alt="Request A Test Drive" />
 </td>
 <td width="20" style="display: none; line-height: 0; font-size: 0; height: 0; padding: 0; mso-hide: all;" class="spacer-width">
  <img class="spacer-width" src="spacer.gif" height="0" width="0" style="display: none; line-height: 0; font-size: 0; height: 0; padding: 0; mso-hide: all;" alt="" />
 </td>
</tr>

感谢您的帮助

【问题讨论】：

标签： html outlook gmail html-email

【解决方案1】：

我使用以下修复程序在 Outlook 2007 及更高版本中隐藏内容：

    <!--[if !gte mso 9]><!---->
    <tr style="display: none; line-height: 0; font-size: 0; height: 0; padding: 0; mso-hide: all;">
 <td width="20" style="display: none; line-height: 0; font-size: 0; height: 0; padding: 0; mso-hide: all;" class="spacer-width">
  <img class="spacer-width" src="spacer.gif" height="0" width="0" style="display: none; line-height: 0; font-size: 0; height: 0; padding: 0; mso-hide: all;" alt="" />
 </td>
 <td width="560" style="display: none; line-height: 0; font-size: 0; height: 0; padding: 0; mso-hide: all;" class="secondary-fullwidth">
  <img src="btn-8.gif" height="0" width="0" style="display: none; line-height: 0; font-size: 0; height: 0; padding: 0; mso-hide: all;" class="btn-two" alt="Request A Test Drive" />
 </td>
 <td width="20" style="display: none; line-height: 0; font-size: 0; height: 0; padding: 0; mso-hide: all;" class="spacer-width">
  <img class="spacer-width" src="spacer.gif" height="0" width="0" style="display: none; line-height: 0; font-size: 0; height: 0; padding: 0; mso-hide: all;" alt="" />
 </td>
</tr>
<!--<![endif]-->

【讨论】：

【解决方案2】：

尝试添加可见性：隐藏；到CSS。它在 Outlook 中有支持，我记得某处“新”Internet Explorer（也许我当时正在使用 8）需要同时正确隐藏某些内容。

【讨论】：

我无法让它在 Outlook 中隐藏 img，无论是内联还是页面级 css。 style="display: none !important; visibility: hidden !important;"