Outlook HTML电子邮件-图像切片中的垂直间隙_Html_Email_Outlook_Slice

Outlook HTML电子邮件-图像切片中的垂直间隙

html email outlook

Outlook HTML电子邮件-图像切片中的垂直间隙,html,email,outlook,slice,Html,Email,Outlook,Slice,所以，典型的问题。我在这里搜了一船货。尝试了所有建议。坚果所以，也许可以问一个新的问题我想，在我的图像切片之间，2013年和2007年的Outlook也存在一些明显的差距。此外，我的文本的扩展比设置的要远知道display:block并不能真正用于Outlook。我已经尝试过在跨距中换行，并给跨距一个display:block 我不知所措。我希望有人能轻松回答这个问题。Grrrrr！！！！见解你为什么要这么受欢迎您有大量的空白导致了间隙： <a href="mms://a1783

所以，典型的问题。我在这里搜了一船货。尝试了所有建议。坚果

所以，也许可以问一个新的问题

我想，在我的图像切片之间，2013年和2007年的Outlook也存在一些明显的差距。此外，我的文本的扩展比设置的要远

知道display:block并不能真正用于Outlook。我已经尝试过在跨距中换行，并给跨距一个display:block

我不知所措。我希望有人能轻松回答这个问题。Grrrrr！！！！见解你为什么要这么受欢迎

您有大量的空白导致了间隙：

<a href="mms://a1783.v167326.c16732.g.vm.akamaistream.net/7/1783/16732/0/QPS.Onstreammedia.com/origin/jjready2/%5bInbox%5d/Talent%20Management/CDF%201-18_WMV.wmv">
                            <img style="display:block" src="http://emaniocreative.com/eblasts/3_26_2013/Message-from-Dominic-&-Louise.jpg"  width="360" height="257" border="0" alt="Message from Dominic &#38; Louise - Video"></a>

而不是您当前拥有的：

<tr>
  ...
</tr>
<tr>
  ...
</tr>

您有大量的空白导致了此间隙：

<a href="mms://a1783.v167326.c16732.g.vm.akamaistream.net/7/1783/16732/0/QPS.Onstreammedia.com/origin/jjready2/%5bInbox%5d/Talent%20Management/CDF%201-18_WMV.wmv">
                            <img style="display:block" src="http://emaniocreative.com/eblasts/3_26_2013/Message-from-Dominic-&-Louise.jpg"  width="360" height="257" border="0" alt="Message from Dominic &#38; Louise - Video"></a>

而不是您当前拥有的：

<tr>
  ...
</tr>
<tr>
  ...
</tr>

不要去看电影

display: [anything]

如果希望包括Outlook 2007。请参阅，以了解哪些CSS样式可以使用，哪些最好不要使用

不要在后面使用任何空格

<td>

不要在前面使用任何空格

</td>

你也应该避免

<style>...</style>

因为这很可能会被完全剥离。始终使用内联样式。我知道这不是一个真正答案的一部分，但只是一个提示：如果你在做HTML时事通讯，就把它们当作是为InternetExplorer4做的。像Outlook这样的电子邮件客户端使用的是你能想象到的最可笑的CSS渲染器。即使是InternetExplorer5在呈现CSS方面也比现代外观更为复杂

哦，顺便说一句：如果你的时事通讯的收件人有可能在hotmail、gmx或gmail中在线阅读它们，那么你也应该检查它们。你会感到敬畏，并想知道那些在线客户端是如何处理你的代码以及它们注入了什么。

不要这样做

display: [anything]

如果希望包括Outlook 2007。请参阅，以了解哪些CSS样式可以使用，哪些最好不要使用

不要在后面使用任何空格

<td>

不要在前面使用任何空格

</td>

你也应该避免

<style>...</style>

你有太多的colspan，这可能会导致问题。您应该将表嵌套起来

我已经创建了数百封电子邮件，但从未遇到过因电子邮件代码中的换行导致的空白问题。Outlook 2007是我签入电子邮件的第一件事

使用显示始终是一种良好的做法：块；并将图像保存在自己的图像中

请尝试以下方法：

<html>
<head>
<title>Ambassador Newsletter</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style>img {display:block}</style>
</head>

<!--REPLACE the following text with the path to the images on your server http://emaniocreative.com/eblasts/3_26_2013/ -->

<body style="margin: 0px; padding: 0px; background-color: #FFFFFF;" bgcolor="#FFFFFF"><table bgcolor="#ebebeb" width="100%" border="0" align="center" cellpadding="0" cellspacing="0"><tr><td><table width="600" border="0" align="center" cellpadding="0" cellspacing="0"><tr><td valign="top" style="padding-top:30px; padding-bottom:30px;">
<table id="Table_01" width="650" border="0" cellpadding="0" cellspacing="0" bgcolor="#ffffff" style="border-collapse: collapse;">
    <tr>
        <td>

<!-- NEST A TABLE INSTEAD-->
      <table width="100%" border="0" cellpadding="0" cellspacing="0" bgcolor="#770000">
        <tr>
          <td style="padding:20px;">
            header
          </td>
        </tr>
      </table>
<!-- /NEST-->

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

<!-- NEST A TABLE INSTEAD-->
      <table width="100%" border="0" cellpadding="0" cellspacing="0">
        <tr>
          <td style="padding:20px;">
            Body section 1
          </td>
        </tr>
        <tr>
          <td style="padding:20px;">
            Body section 2
          </td>
        </tr>
      </table>
<!-- /NEST-->

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

</td></tr></table></td></tr></table></body></html>

另一方面，当从Outlook转发到Gmail时，垂直分隔是不可避免的问题，例如，由于添加了mso.normal p标签，但是对于最初的收件人来说没有问题。

您的colspan太多，这可能会导致问题。您应该将表嵌套起来

我已经创建了数百封电子邮件，但从未遇到过因电子邮件代码中的换行导致的空白问题。Outlook 2007是我签入电子邮件的第一件事

使用显示始终是一种良好的做法：块；并将图像保存在自己的图像中

请尝试以下方法：

<html>
<head>
<title>Ambassador Newsletter</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style>img {display:block}</style>
</head>

<!--REPLACE the following text with the path to the images on your server http://emaniocreative.com/eblasts/3_26_2013/ -->

<body style="margin: 0px; padding: 0px; background-color: #FFFFFF;" bgcolor="#FFFFFF"><table bgcolor="#ebebeb" width="100%" border="0" align="center" cellpadding="0" cellspacing="0"><tr><td><table width="600" border="0" align="center" cellpadding="0" cellspacing="0"><tr><td valign="top" style="padding-top:30px; padding-bottom:30px;">
<table id="Table_01" width="650" border="0" cellpadding="0" cellspacing="0" bgcolor="#ffffff" style="border-collapse: collapse;">
    <tr>
        <td>

<!-- NEST A TABLE INSTEAD-->
      <table width="100%" border="0" cellpadding="0" cellspacing="0" bgcolor="#770000">
        <tr>
          <td style="padding:20px;">
            header
          </td>
        </tr>
      </table>
<!-- /NEST-->

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

<!-- NEST A TABLE INSTEAD-->
      <table width="100%" border="0" cellpadding="0" cellspacing="0">
        <tr>
          <td style="padding:20px;">
            Body section 1
          </td>
        </tr>
        <tr>
          <td style="padding:20px;">
            Body section 2
          </td>
        </tr>
      </table>
<!-- /NEST-->

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

</td></tr></table></td></tr></table></body></html>

另一方面，当从Outlook转发到Gmail时，垂直分隔是不可避免的问题，例如，添加了mso.normal p标签，但对于最初的收件人来说没有问题。

谢谢你们的建议。我尝试使用display:inline块确保边框塌陷：塌陷；设置了属性，甚至去掉了所有的空白，以确保仍能在图像中看到这些间隙，这是一个令人头痛的问题。我在显示屏上留下了：因为它们可以帮助Gmail避免出现水平间隙。谢谢你们两位的建议。我尝试使用display:inline块确保边框塌陷：塌陷；设置了属性，甚至去掉了所有的空白，以确保仍能在图像中看到这些间隙，这是一个令人头痛的问题。我把它放在显示屏上：因为它们可以帮助Gmail避免水平间隙。