0

I have spent 22 hours trying to correct this issue, as I am relatively new, I thought I would give up and hand over to the experts.

I have tried to remove the additional line height added by outlook.com when you receive a message. I have tried adding the .ExternalClass as a style and then adding that to the body, but I am having no joy. I have probably added the class in the wrong position. Anyway, Id' love it if anyone could check the code for me

<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>
4

2 回答 2

0

自从我制作电子邮件模板已经有一段时间了,但上次我做的时候,Outlook(和 Outlook.com/Hotmail)不支持该style标签。style您必须使用每个需要它的元素的属性来内联样式。

您能否在浏览器中验证收到的电子邮件中是否仍然存在样式标签?如果不是,那么它仍然会在显示邮件之前被删除。

我想这是有道理的,否则您可能会影响 Outlook 本身的布局,并且他们可能希望阻止这种情况,因为否则您可能会通过发送恶意邮件来欺骗整个邮件客户端界面。

看看这个网站。它显示了一个表格,其中列出了哪些客户端支持哪些功能:

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

于 2014-03-26T22:20:00.377 回答
0

简单地使用.ExternalClass *并不能解决问题。我建议你使用和电子邮件内联,有十几个从 webtools 到ASP.NETNodeJS库。

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

于 2015-10-09T13:31:38.123 回答