Question

我花了22个小时试图纠正这个问题，因为我相对较新，我以为我会放弃并交给专家。

我在收到邮件时尝试删除outlook.com添加的额外行高。我已经尝试将.ExternalClass添加为样式，然后将其添加到正文中，但我没有快乐。我可能把班级添加到了错误的位置。无论如何，Id＆＃39;如果有人能为我检查代码，那就爱上它了

<style>
    .ExternalClass * {line-height: 100%} 
</style>
</head>
<body class="ExternalClass" style="font-family:Arial, Helvetica, sans-serif">
<table width="900px" border="0px" align="left" cellpadding="0px" cellspacing="0px">
  <tr>
    <td>
<table width="900px" border="0px" cellspacing="0px" cellpadding="0px" style="padding-bottom: 10px">
  <tr>
  </tr>
</table>
<table width="700" border="0" cellspacing="0" cellpadding="0" style="clear:both; overflow:hidden; padding-bottom: 40px">
  <tr>
    <td width="180">
    <table width="154" height="154" border="0px" align="left" cellpadding="0" cellspacing="0" >
      <tr>
        <td bgcolor="#0099FF"><img src="http://www.internet.com/images/emails/pic.jpg" width="154px" height="154px" alt="Dan Tanner"></td>
      </tr>
    </table></td>
    <td valign="top">
    <table style="padding:0; margin:0;" width="520" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td><table width="520" border="0" cellspacing="0" cellpadding="0">
      <tr>
        <td width="160" style="background-color:#173966; color:#FFF; font-size:26px; line-height: 26px; font-weight:bold; padding-left:10px;">My Name</td >
        <td width="360">&nbsp;</td>
      </tr>
    </table></td>
  </tr>
  <tr>
    <td><table width="520" border="0" cellspacing="0" cellpadding="0">
      <tr>
        <td width="15"></td>
        <td width="115" style="background-color:#ee2375; color:#FFF; font-size:18px; font-style:italic; padding-left:10px">Co-Founder</td>
        <td width="390">&nbsp;</td>
      </tr>
    </table></td>
  </tr>  
  <tr>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td><table width="520" border="0" cellspacing="0" cellpadding="0" style="font-size:18px">
      <tr>
        <td width="90">Email:</td>
        <td width="430">myemail@email.com</td>
      </tr>
    </table></td>
  </tr>
  <tr>
    <td><table width="520" border="0" cellspacing="0" cellpadding="0" style="font-size:18px">
      <tr>
        <td width="90">Phone:</td>
        <td width="430">0123456789</td>
      </tr>
    </table></td>
  </tr>
  <tr>
    <td><table width="520" border="0" cellspacing="0" cellpadding="0" style="font-size:18px">
      <tr>
        <td width="90">Website:</td>
        <td width="430"><a href="http://www.internet.com" target="_blank">www.internet.com</a></td>
      </tr>
    </table></td>
  </tr>
</table>
    </td>
  </tr>
</table>
</td>
  </tr>
</table>
</body>

Answer 1

我制作电子邮件模板已经有一段时间了，但是上次我做了，Outlook（和Outlook.com/Hotmail）不支持style标记。您必须在需要它的每个元素上使用style属性内联样式。

您可以在浏览器中验证收到的电子邮件中是否仍存在样式标记？如果没有，那么在显示邮件之前它仍然被剥离。

我认为它很有意义，因为否则你可能会影响Outlook本身的布局，他们可能想要阻止它，因为你可以通过发送恶意邮件欺骗整个邮件客户端界面。

看看这个网站。它显示了一个表，其中包含哪些客户端的功能：

http://www.campaignmonitor.com/css/

Answer 2

简单地使用.ExternalClass *并不能解决问题。我建议您使用并通过电子邮件发送内联邮件，其中有十几种，从webtools到ASP.NET或NodeJS库。

例如。 http://premailer.dialect.ca/

HTML电子邮件：行高Outlook.com忽略.ExternalClass * {line-height：100％}

2 个答案: