20

我正在设置一个电子邮件模板,一些图像的顶部被剪掉了。这是我的图像代码

<td style="line-height: 0"><img src="http://domain.com/image.png"></td>

我在 td 上有行高,以便删除下面的空白,因为我希望它接触下面的图像。

顶部图像有一点顶部被切断,我该如何解决这个问题?

4

8 回答 8

27

我对 ol 2013/16 也有同样的问题。

最好的解决方案是指定行高以像素表示。

更改line-height:0;line-height: 0px

于 2016-04-20T13:03:19.327 回答
14

我解决这个问题的方法是不使用 line-height 而是将图像设置为显示块,这解决了图像问题并仍然删除了下面的空白

<td><img src="http://domain.com/image.png" style="display:block;"></td>

希望这对某人有帮助!

于 2013-06-25T13:37:13.997 回答
6

我将行高设置为“1”,这解决了我的问题:0)

<table>
  <tr>
    <td style="line-height:1;">
      <img src="http://example.com/138x33-team.png" width="138" height="33" style="display:block;">
    </td>
  </tr>
</table>

于 2018-12-13T12:22:14.237 回答
4

我在这个问题上花太多时间,所以不妨为任何可能看到这个的人记录我的解决方案。

我通过将图像嵌套在另一个表中来解决问题,如下所示:

<td style="line-height: 0">
<table>
  <tr>
    <td>
      <img src="http://example.com/image.png">
    </td>
  </tr>
</table>
</td>
于 2018-10-24T14:38:48.163 回答
2

我的测试表明,在 Outlook 2013 中,与早期的 Outlook 版本不同,将 line-height 设置为 0 会导致容器小于包含的图像。结果是包含图像的顶部被裁剪。我可以解决此问题的唯一方法是将 line-height 设置为 0 以外的值。我使用 line-height: 17px 并且图像正确显示。它可能适用于 0 以外的任何其他值——我没有测试小于 17px 的值。

设置显示:块没有解决这个问题。由于这仅是 Outlook 2013 的问题,并且不会影响任何早期的 Outlook 版本或其他移动或桌面电子邮件客户端,因此可以安全地假设这是 Outlook 2013 的错误,并且预计不会有 Microsoft 的修复。因此,如果有人能证实我的发现,最好将此解决方法集成到您已经超大的解决方法调色板中,以适应 Microsoft 糟糕的 HTML 电子邮件支持。

于 2014-10-03T12:16:10.580 回答
0

总是Display:block在所有图像上使用,否则你会不时得到一些空白:)

于 2013-07-08T12:46:42.717 回答
0

在文本块中插入图像时,我在 MailChimp 中遇到了这个问题。为了解决这个问题,我将文本块的行高设置为双倍空格。之后,我重置模板中每个块的所有样式。希望这可以帮助!

于 2015-09-29T16:21:18.343 回答
0

我的电子邮件中遇到了同样的问题。我只是从mso-line-height-rule我的邮件中删除财产,它对我有用。

于 2019-03-28T10:51:19.367 回答