html - Outlook 到 Gmail 间距问题

问题描述

我正在尝试整理一些电子邮件签名，但在从 Outlook 发送到 gmail 时遇到了问题。将签名从 gmail 发送到 Outlook 看起来不错 - 并且签名在 Outlook 客户端中看起来不错。但是，一旦将电子邮件从 Outlook 发送到 gmail，它就会增加间距并使事情变得有些混乱。我已经进行了一些研究并尝试实施修复，但到目前为止还没有运气。

这是在 Outlook 中正确显示的电子邮件：这里它在 gmail 收到后显示不正确

奇怪的是从 gmail 发送时它工作正常，所以在从 Outlook > gmail 发送的过程中一定会发生一些事情。任何提示将非常感谢！我知道我的代码不是很好，只是一个平面设计师通过电子邮件样式与我作斗争！

更新：似乎gmail中的这段代码是问题所在，有没有办法覆盖它？图片

下面的代码：

<head>
    <style>
    span, p, td, tr {color:#24406d; line-height: 90%;mso-line-height: taro-papo; font-family: Helvetica, Arial, sans-serif;}
    </style>
</head>
<html>
<body>
<table bgcolor="#ffffff" style="width: 320px; background: white;">
    <tr><td><hr></td></tr>
<td><span style="font-size: 22px; font-weight: 600;">Name Nameson</span></td></tr>
<tr><td><span style="text-transform: uppercase; font-size: 14px;">Customer Service Manager</span></td></tr>
<tr><td><hr></td></tr>
    <tr><td><span style="font-weight: 600;">P.</span>&nbsp;&nbsp;<span>07 1111 1111</span></td></tr>
    <tr><td><span style="font-weight: 600;">M.</span>&nbsp;&nbsp;<span>0401 111 111</span></td></tr>
    <tr><td><span style="font-weight: 600;">E.</span>&nbsp;&nbsp;<span>test@venetablinds.com.au</td></tr>
    <tr><td><span style="font-weight: 600;">A.</span>&nbsp;&nbsp;<span>13/14 Argyle St, Albion QLD 4010</td></tr>
    <tr><td><span style="font-weight: 600;">W.</span>&nbsp;&nbsp;<span>www.venetablinds.com.au</p></td></tr>
<tr><td><img src="https://drive.google.com/uc?id=1xze-aa3lvrf6Rrvl0Krb5G2sfVA2LZFm" width="320px"></tr>
<tr><td><span style="white-space: nowrap;">
    <a><img src="https://drive.google.com/uc?id=1jiViwT0NnYrNSeUbfjh1RwbyMfL4IACa"></a> 
    <a><img src="https://drive.google.com/uc?id=1S1wRD6Fqx8MqDu0RlCYauhgWiBMVCLyo"></a> 
    <a><img src="https://drive.google.com/uc?id=18yiUbFJ4NAapVLkMBBrAvo-HrQFNZ6-e"></a></td></span></tr>
</span>
</table>
</body>
</html>

标签： htmlcssemailoutlookgmail

解决方案

你能检查下面的代码吗？希望它对你有用。您必须做出让步，cellpadding="0"我们已经更改了您的 HTML 结构以获得所需的输出。cellspacing="0"table

请参考此链接：https ://jsfiddle.net/yudizsolutions/rhL0p7nw/3/

<html>

<head>
  <style>
    span,
    p,
    td,
    tr {
      color: #24406d;
      line-height: 90%;
      mso-line-height: taro-papo;
      font-family: Helvetica, Arial, sans-serif;
    }
  </style>
</head>

<body>
  <table cellpadding="0" cellspacing="0" bgcolor="#ffffff" style="width: 320px; background: white;">
    <tr>
      <td>
        <hr>
      </td>
    </tr>
    <tr>
      <td><span style="font-size: 22px; font-weight: 600;">Name Nameson</span></td>
    </tr>
    <tr>
      <td height="5"></td>
    </tr>
    <tr>
      <td><span style="text-transform: uppercase; font-size: 14px;">Customer Service Manager</span></td>
    </tr>
    <tr>
      <td>
        <hr>
      </td>
    </tr>
    <tr>
      <td><span style="font-weight: 600;">P.</span>&nbsp;&nbsp;<span>07 1111 1111</span></td>
    </tr>
    <tr>
      <td height="5"></td>
    </tr>
    <tr>
      <td><span style="font-weight: 600;">M.</span>&nbsp;&nbsp;<span>0401 111 111</span></td>
    </tr>
    <tr>
      <td height="5"></td>
    </tr>
    <tr>
      <td><span style="font-weight: 600;">E.</span>&nbsp;&nbsp;<span>test@venetablinds.com.au</span></td>
    </tr>
    <tr>
      <td height="5"></td>
    </tr>
    <tr>
      <td><span style="font-weight: 600;">A.</span>&nbsp;&nbsp;<span>13/14 Argyle St, Albion QLD 4010</span></td>
    </tr>
    <tr>
      <td height="5"></td>
    </tr>
    <tr>
      <td><span style="font-weight: 600;">W.</span>&nbsp;&nbsp;<span>www.venetablinds.com.au</span></p>
      </td>
    </tr>
    <tr>
      <td><img src="https://drive.google.com/uc?id=1xze-aa3lvrf6Rrvl0Krb5G2sfVA2LZFm" width="320px">
    </tr>
    <tr>
      <td height="5"></td>
    </tr>
    <tr>
      <td>
        <a><img src="https://drive.google.com/uc?id=1jiViwT0NnYrNSeUbfjh1RwbyMfL4IACa"></a>
        <a><img src="https://drive.google.com/uc?id=1S1wRD6Fqx8MqDu0RlCYauhgWiBMVCLyo"></a>
        <a><img src="https://drive.google.com/uc?id=18yiUbFJ4NAapVLkMBBrAvo-HrQFNZ6-e"></a>
      </td>
    </tr>
  </table>
</body>

</html>

请检查结果图像：

html - Outlook 到 Gmail 间距问题

问题描述

解决方案

推荐阅读