1

**编辑，该问题仅存在于 Outlook Web App 的预览窗格中**

我几乎尝试了所有方法，但似乎无法消除 Outlook 2007/2010 在屏幕右侧的预览框中呈现的空白/换行符。当您双击收件箱列表中的电子邮件时，HTML 会完美加载。但是，当它显示在拆分收件箱列表/电子邮件预览窗口中时，会生成换行符/空格。

我已经尝试了书中的每一个技巧。边框折叠，边框 = 0，显示：块，单元格间距/单元格填充：0，！重要等。没有任何效果。

这就是我所抱怨的。（为了隐私，我把所有东西都涂黑了）：

  1. 209.67.20.161/email/linebreaks.png
  2. 209.67.20.161/email/linebreaks2.png
  3. 209.67.20.161/email/linebreaks3.png

它可能是本文中提到的“打印页限制 (Microsoft Word)”：

www.emailonacid.com/blog/details/C13/horizo​​ntal_spacing_issues_in_outlook_2007_and_2010

但是，我不这么认为，因为有些换行符彼此非常接近。

顺便说一句，我在 Photoshop 中切片图像并保存用于网络设备。

这是切片图像：http: //209.67.20.161/email/slices.png

做我的救命恩人...

链接到我的 HTML：http: //209.67.20.161/email/email_sliced_forss.html

您可以使用 ctrlq.org/html-mail 将 HTML 电子邮件发送到您自己的 Outlook 收件箱，并在选择 HTML 编辑器后将我的 HTML 源复制并粘贴到框中。

4

2 回答 2

4

像在这个例子中那样设计你的 html 电子邮件，它将在所有主要客户中完美呈现，即使是像 lotus notes 这样的旧客户。

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
        <html xmlns="http://www.w3.org/1999/xhtml">
        <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>Untitled Document</title>

<style media="all" type="text/css">
table td
{
border-collapse: collapse;
}
</style>
    </head>

    <body>
    <table width="680" border="0" cellpadding="0" cellspacing="0">
        <tr>
            <td width="20" align="left" valign="top" rowspan="2" bgcolor="#FFFFFF" style="font-size: 10px; font-family: arial; line-height:170px;">&nbsp;</td>
            <td width="300" height="170" rowspan="2" align="left" valign="top">
                <img src="another image" alt="" width="300" height="170" border="0"></td>
            <td width="33" align="left" valign="top" bgcolor="#FFFFFF" style="font-size: 10px; font-family: arial; line-height:140px;">&nbsp;</td>
            <td width="327" colspan="2" align="left" valign="top" bgcolor="#FFFFFF" style="font-size: 14px; font-family: arial; color:#5D5B5C; line-height: 16px;">some exemple text here</td>
        </tr>
        <tr>
            <td width="33" bgcolor="#FFFFFF" style="font-size: 10px; font-family: arial; line-height:30px;">&nbsp;</td>
            <td width="138" height="30" align="left" valign="top"><a href="some link here" target="_blank"><img src="image here" alt="details" width="138" height="30" border="0"></a></td>
            <td width="189" bgcolor="#FFFFFF" style="font-size: 10px; font-family: arial; line-height:30px;">&nbsp;</td>
        </tr>
    </table>
    </body>
    </html>

这是另一个帖子的链接，我在其中解释了如何使用空 TD 单元而不是垫片。 HTML 电子邮件 - 空表/TR/TD 作为间隔

于 2012-05-09T23:07:57.217 回答
0

尝试style="line-height:your-image-size px;"在<td>; 此外，在图像标签内使用 style="display:block;"

于 2013-01-10T00:40:54.700 回答