【问题标题】:sending html signature from outlook does not render well in hotmail从 Outlook 发送 html 签名在 hotmail 中无法很好地呈现
【发布时间】:2015-05-14 14:38:06
【问题描述】:

我有一个要从 Outlook 发送的 html 签名。它渲染得很好,但问题是 hotmail 显示它的方式不同。

它添加了额外的带有填充的 p 标签。类名为ecxMsoNormal

下面是我试图从 MS Outlook 2010 发送到 hotamil.com 的 html。它在大多数客户端中都能很好地呈现,但在 hotmail.com 中却不行

<!DOCTYPE html>
<html>
<head>
<style type="text/css">
<!--
p.MsoNormal {
    margin: 0px !important;
    text-decoration: none !important;
}

p.ecxMsoNormal {
    margin: 0px !important;
}

td {
    padding: 0px !important;
}

a {
    text-decoration: none !important;
}
-->
</style>
</head>
<body>

    <table style="mso-table-lspace: 0; mso-table-rspace: 0; min-width: 400px;max-width:525px">
        <tr>
            <td>
                <table width="100%" style="mso-table-lspace: 0; mso-table-rspace: 0;">
                    <td>
                        <table style="mso-table-lspace: 0; mso-table-rspace: 0;">
                        <tr>
                                <td valign="bottom" nowrap style=" line-height:1px; border-top: 1pt solid black; ">&nbsp; </td>
                            </tr>
                            <tr>
                                <td valign="bottom" nowrap style="  "><SPAN
                                    STYLE="color: #005a83; font-size: 11pt; font-family: arial; margin: 0; padding: 0;">Shamraiz Akhtar</SPAN></td>
                            </tr>
                            <tr>
                                <td valign="bottom" align="left" style="mso-line-height-rule:exactly; line-height:23px; height:23px;" nowrap><SPAN
                                    STYLE="color: #92d050; font-size: 10pt; font-family: arial; margin: 0; padding: 0;  vertical-align: bottom ; ">Technical Support Engineer</SPAN></td>
                            </tr>
                        </table>
                    </td>
                    <td></td>
                    <td></td>
                    <td></td>
                    <td></td>
                    <td></td>
                    <td></td>
                    <td></td>
                    <td></td>
                    <td></td>
                    <td></td>
                    <td valign="bottom">
                    <table width = "100%"><tr>
                    <td valign="bottom" ><img width="168.2" height="46.5" align="right" src="https://www.spectrumgeo.com/wp-content/uploads/Spectrum_logo_email-171w.jpg" nosend="1" /></td>
                    </tr></table></td>
                    </tr>
                </table>
            </td>
        </tr>
        <tr>
            <td>
                <table style=" width: 100%; line-height:23px; height:53px;" >
                    <tr>
                        <td align="left" nowrap><SPAN STYLE="color: #92d050; font-size: 9pt; font-family: arial; margin: 0; padding: 0;">&nbsp; t:</SPAN>
                        <span
                            STYLE="color: #005a83; font-size: 9pt; font-family: arial; margin: 0; padding: 0;">+44 1483 730201</span></td>
                            <td></td>
                    <td>&nbsp;</td>
                    <td>&nbsp;</td>
                    <td>&nbsp;</td>
                    <td>&nbsp;</td>
                        <td align="center" style='padding-left: 10px;' nowrap><SPAN STYLE="font-size: 14pt; margin: 0; padding: 0;">| </SPAN></td>
                        <td></td>
                    <td>&nbsp;</td>
                    <td>&nbsp;</td>
                    <td>&nbsp;</td>
                    <td>&nbsp;</td>
                        <td align="center" style='padding: 0in 0in 0in 0in' nowrap><SPAN STYLE="color: #92d050; font-size: 9pt; font-family: arial; margin: 0; padding: 0;">f:</SPAN>
                        <span STYLE="color: #005a83; font-size: 9pt; font-family: arial; margin: 0; padding: 0;">+44 1483 762620</span></td>
                        <td></td>
                    <td>&nbsp;</td>
                    <td>&nbsp;</td>
                    <td>&nbsp;</td>
                    <td>&nbsp;</td>
                        <td align="center" style='padding-left: 10px;' ><SPAN STYLE="font-size: 14pt; margin: 0; padding: 0;">| </SPAN></td>
                        <td></td>
                    <td>&nbsp;</td>
                    <td>&nbsp;</td>
                    <td>&nbsp;</td>
                    <td>&nbsp;</td>
                        <td align="right" style='padding: 0in 0in 0in 0in' nowrap><SPAN STYLE="color: #92d050; font-size: 9pt; font-family: arial; margin: 0; padding: 0;">w:</SPAN>
                        <span STYLE="color: #005a83; font-size: 9pt; font-family: arial; margin: 0; padding: 0;">
                        <a STYLE="color: #005a83; text-decoration: none !important;" href="www.spectrumgeo.com">spectrumgeo.com</a></span></td>

                    </tr>
                </table>
            </td>
        </tr>
        <tr>
            <td>
                <table style="mso-table-lspace: 0; mso-table-rspace: 0; line-height:23px; height:53px;">
                    <tr>
                        <td colspan="9" style='padding: 0in 0in 0in 0in'><SPAN
                            STYLE="color: #005a83; font-size: 8pt; font-family: arial;">&nbsp; Dukes
                                Court, Dukes Street, Woking, Surrey, GU21 5BH, UK</span></td>
                    </tr>
                </table>
            </td>
        </tr>
        <tr>
            <td>
                <table style="mso-table-lspace: 0; mso-table-rspace: 0;">
                    <tr>
                        <td><SPAN STYLE="color: #005a83; font-size: 8pt; font-family: arial; text-decoration: none !important;">&nbsp; follow us on 
                                <span   style="text-decoration: none !important;">&#149 
                                <a style="color: #00b0ed; text-decoration: none !important;" href="https://twitter.com/SpectrumASA">twitter
                                </span></a>&#149
                                <a style="color: #3b5998; text-decoration: none !important;" href="https://www.facebook.com/spectrum.geo"> facebook
                            </a> &#149 <a style="color: #0077b5; text-decoration: none !important;"
                                href="https://www.linkedin.com/company/spectrum-asa">
                                     linkedin</a>
                        </span></td>
                    </tr>
                </table>
            </td>
        </tr>
    </table>
</body>
</html>

来自 hotmail.com 的 HTML

<style>
.ExternalClass p.ecxMsoNormal, .ExternalClass li.ecxMsoNormal, .ExternalClass div.ecxMsoNormal {
font-size:11.0pt;
font-family:"Calibri","sans-serif";
}

.ExternalClass a:link, .ExternalClass span.ecxMsoHyperlink {
color:blue;
text-decoration:underline;
}

.ExternalClass span.ecxMsoHyperlinkFollowed {
color:purple;
text-decoration:underline;
}

.ExternalClass span.ecxEmailStyle17 {
font-family:"Calibri","sans-serif";
color:windowtext;
}

.ExternalClass .ecxMsoChpDefault {
font-family:"Calibri","sans-serif";
}

.ExternalClass div.ecxWordSection1 {
}

</style>


<div class="ecxWordSection1">
<p class="ecxMsoNormal">&nbsp;</p>
<p class="ecxMsoNormal">&nbsp;</p>
<table class="ecxMsoNormalTable" border="0" cellpadding="0">
<tbody>
<tr>
<td style="padding:0cm 0cm 0cm 0cm;">
<table class="ecxMsoNormalTable" style="width:100.0%;" width="100%" border="0" cellpadding="0">
<tbody>
<tr>
<td style="padding:0cm 0cm 0cm 0cm;">
<table class="ecxMsoNormalTable" border="0" cellpadding="0">
<tbody>
<tr>
<td style="border:none;border-top:solid black 1.0pt;padding:0cm 0cm 0cm 0cm;" nowrap="" valign="bottom">
<p class="ecxMsoNormal" style=""><span style="font-size:12.0pt;font-family:&quot;Times New Roman&quot;,&quot;serif&quot;;">&nbsp;
</span></p>
</td>
</tr>
<tr>
<td style="padding:0cm 0cm 0cm 0cm;" nowrap="" valign="bottom">
<p class="ecxMsoNormal"><span style="font-family:&quot;Arial&quot;,&quot;sans-serif&quot;;color:#005A83;">Shamraiz Akhtar</span><span style="font-size:12.0pt;font-family:&quot;Times New Roman&quot;,&quot;serif&quot;;"></span></p>
</td>
</tr>
<tr style="height:17.25pt;">
<td style="padding:0cm 0cm 0cm 0cm;height:17.25pt;" nowrap="" valign="bottom">
<p class="ecxMsoNormal" style="line-height:17.25pt;"><span style="font-size:10.0pt;font-family:&quot;Arial&quot;,&quot;sans-serif&quot;;color:#92D050;">Technical Support Engineer</span><span style="font-size:12.0pt;font-family:&quot;Times New Roman&quot;,&quot;serif&quot;;"></span></p>
</td>
</tr>
</tbody>
</table>
</td>
<td style="padding:0cm 0cm 0cm 0cm;"></td>
<td style="padding:0cm 0cm 0cm 0cm;"></td>
<td style="padding:0cm 0cm 0cm 0cm;"></td>
<td style="padding:0cm 0cm 0cm 0cm;"></td>
<td style="padding:0cm 0cm 0cm 0cm;"></td>
<td style="padding:0cm 0cm 0cm 0cm;"></td>
<td style="padding:0cm 0cm 0cm 0cm;"></td>
<td style="padding:0cm 0cm 0cm 0cm;"></td>
<td style="padding:0cm 0cm 0cm 0cm;"></td>
<td style="padding:0cm 0cm 0cm 0cm;"></td>
<td style="padding:0cm 0cm 0cm 0cm;" valign="bottom">
<table class="ecxMsoNormalTable" style="width:100.0%;" width="100%" border="0" cellpadding="0">
<tbody>
<tr>
<td style="padding:0cm 0cm 0cm 0cm;" valign="bottom">
<p class="ecxMsoNormal"><img src="https://dub111.afx.ms/att/GetInline.aspx?messageid=dbd438e5-cd89-11e4-94d4-d89d675c89ae&amp;attindex=0&amp;cp=-1&amp;attdepth=0&amp;imgsrc=cid%3aimage001.jpg%4001D06196.9A364160&amp;cid=8cdc5241b8bbef16&amp;hm__login=shorif2000&amp;hm__domain=hotmail.com&amp;ip=10.211.24.8&amp;d=d4389&amp;mf=32&amp;hm__ts=Wed%2c%2018%20Mar%202015%2016%3a14%3a46%20GMT&amp;st=shorif2000&amp;hm__ha=01_b23645d1fb986111e84fcc757dcb02baf2fd07545d47e67f35b5452c5bca60e4&amp;oneredir=1" alt="https://www.spectrumgeo.com/wp-content/uploads/Spectrum_logo_email-171w.jpg" align="right" width="168" height="46"><span style="font-size:12.0pt;font-family:&quot;Times New Roman&quot;,&quot;serif&quot;;"></span></p>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
<td style="padding:0cm 0cm 0cm 0cm;">
<table class="ecxMsoNormalTable" style="width:100.0%;" width="100%" border="0" cellpadding="0">
<tbody>
<tr>
<td style="padding:0cm 0cm 0cm 0cm;" nowrap="">
<p class="ecxMsoNormal" style="line-height:17.25pt;"><span style="font-size:9.0pt;font-family:&quot;Arial&quot;,&quot;sans-serif&quot;;color:#92D050;">&nbsp; t:</span><span style="font-size:12.0pt;font-family:&quot;Times New Roman&quot;,&quot;serif&quot;;">
</span><span style="font-size:9.0pt;font-family:&quot;Arial&quot;,&quot;sans-serif&quot;;color:#005A83;">+44 1483 730201</span><span style="font-size:12.0pt;font-family:&quot;Times New Roman&quot;,&quot;serif&quot;;"></span></p>
</td>
<td style="padding:0cm 0cm 0cm 0cm;"></td>
<td style="padding:0cm 0cm 0cm 0cm;">
<p class="ecxMsoNormal" style="line-height:17.25pt;"><span style="font-size:12.0pt;font-family:&quot;Times New Roman&quot;,&quot;serif&quot;;">&nbsp;</span></p>
</td>
<td style="padding:0cm 0cm 0cm 0cm;">
<p class="ecxMsoNormal" style="line-height:17.25pt;"><span style="font-size:12.0pt;font-family:&quot;Times New Roman&quot;,&quot;serif&quot;;">&nbsp;</span></p>
</td>
<td style="padding:0cm 0cm 0cm 0cm;">
<p class="ecxMsoNormal" style="line-height:17.25pt;"><span style="font-size:12.0pt;font-family:&quot;Times New Roman&quot;,&quot;serif&quot;;">&nbsp;</span></p>
</td>
<td style="padding:0cm 0cm 0cm 0cm;">
<p class="ecxMsoNormal" style="line-height:17.25pt;"><span style="font-size:12.0pt;font-family:&quot;Times New Roman&quot;,&quot;serif&quot;;">&nbsp;</span></p>
</td>
<td style="padding:0cm 0cm 0cm 0cm;" nowrap="">
<p class="ecxMsoNormal" style="text-align:center;line-height:17.25pt;" align="center">
<span style="font-size:14.0pt;font-family:&quot;Times New Roman&quot;,&quot;serif&quot;;">|
</span><span style="font-size:12.0pt;font-family:&quot;Times New Roman&quot;,&quot;serif&quot;;"></span></p>
</td>
<td style="padding:0cm 0cm 0cm 0cm;"></td>
<td style="padding:0cm 0cm 0cm 0cm;">
<p class="ecxMsoNormal" style="line-height:17.25pt;"><span style="font-size:12.0pt;font-family:&quot;Times New Roman&quot;,&quot;serif&quot;;">&nbsp;</span></p>
</td>
<td style="padding:0cm 0cm 0cm 0cm;">
<p class="ecxMsoNormal" style="line-height:17.25pt;"><span style="font-size:12.0pt;font-family:&quot;Times New Roman&quot;,&quot;serif&quot;;">&nbsp;</span></p>
</td>
<td style="padding:0cm 0cm 0cm 0cm;">
<p class="ecxMsoNormal" style="line-height:17.25pt;"><span style="font-size:12.0pt;font-family:&quot;Times New Roman&quot;,&quot;serif&quot;;">&nbsp;</span></p>
</td>
<td style="padding:0cm 0cm 0cm 0cm;">
<p class="ecxMsoNormal" style="line-height:17.25pt;"><span style="font-size:12.0pt;font-family:&quot;Times New Roman&quot;,&quot;serif&quot;;">&nbsp;</span></p>
</td>
<td style="padding:0cm 0cm 0cm 0cm;" nowrap="">
<p class="ecxMsoNormal" style="text-align:center;line-height:17.25pt;" align="center">
<span style="font-size:9.0pt;font-family:&quot;Arial&quot;,&quot;sans-serif&quot;;color:#92D050;">f:</span><span style="font-size:12.0pt;font-family:&quot;Times New Roman&quot;,&quot;serif&quot;;">
</span><span style="font-size:9.0pt;font-family:&quot;Arial&quot;,&quot;sans-serif&quot;;color:#005A83;">+44 1483 762620</span><span style="font-size:12.0pt;font-family:&quot;Times New Roman&quot;,&quot;serif&quot;;"></span></p>
</td>
<td style="padding:0cm 0cm 0cm 0cm;"></td>
<td style="padding:0cm 0cm 0cm 0cm;">
<p class="ecxMsoNormal" style="line-height:17.25pt;"><span style="font-size:12.0pt;font-family:&quot;Times New Roman&quot;,&quot;serif&quot;;">&nbsp;</span></p>
</td>
<td style="padding:0cm 0cm 0cm 0cm;">
<p class="ecxMsoNormal" style="line-height:17.25pt;"><span style="font-size:12.0pt;font-family:&quot;Times New Roman&quot;,&quot;serif&quot;;">&nbsp;</span></p>
</td>
<td style="padding:0cm 0cm 0cm 0cm;">
<p class="ecxMsoNormal" style="line-height:17.25pt;"><span style="font-size:12.0pt;font-family:&quot;Times New Roman&quot;,&quot;serif&quot;;">&nbsp;</span></p>
</td>
<td style="padding:0cm 0cm 0cm 0cm;">
<p class="ecxMsoNormal" style="line-height:17.25pt;"><span style="font-size:12.0pt;font-family:&quot;Times New Roman&quot;,&quot;serif&quot;;">&nbsp;</span></p>
</td>
<td style="padding:0cm 0cm 0cm 0cm;">
<p class="ecxMsoNormal" style="text-align:center;line-height:17.25pt;" align="center">
<span style="font-size:14.0pt;font-family:&quot;Times New Roman&quot;,&quot;serif&quot;;">|
</span><span style="font-size:12.0pt;font-family:&quot;Times New Roman&quot;,&quot;serif&quot;;"></span></p>
</td>
<td style="padding:0cm 0cm 0cm 0cm;"></td>
<td style="padding:0cm 0cm 0cm 0cm;">
<p class="ecxMsoNormal" style="line-height:17.25pt;"><span style="font-size:12.0pt;font-family:&quot;Times New Roman&quot;,&quot;serif&quot;;">&nbsp;</span></p>
</td>
<td style="padding:0cm 0cm 0cm 0cm;">
<p class="ecxMsoNormal" style="line-height:17.25pt;"><span style="font-size:12.0pt;font-family:&quot;Times New Roman&quot;,&quot;serif&quot;;">&nbsp;</span></p>
</td>
<td style="padding:0cm 0cm 0cm 0cm;">
<p class="ecxMsoNormal" style="line-height:17.25pt;"><span style="font-size:12.0pt;font-family:&quot;Times New Roman&quot;,&quot;serif&quot;;">&nbsp;</span></p>
</td>
<td style="padding:0cm 0cm 0cm 0cm;">
<p class="ecxMsoNormal" style="line-height:17.25pt;"><span style="font-size:12.0pt;font-family:&quot;Times New Roman&quot;,&quot;serif&quot;;">&nbsp;</span></p>
</td>
<td style="padding:0cm 0cm 0cm 0cm;" nowrap="">
<p class="ecxMsoNormal" style="text-align:right;line-height:17.25pt;" align="right"><span style="font-size:9.0pt;font-family:&quot;Arial&quot;,&quot;sans-serif&quot;;color:#92D050;">w:</span><span style="font-size:12.0pt;font-family:&quot;Times New Roman&quot;,&quot;serif&quot;;">
</span><span style="font-size:9.0pt;font-family:&quot;Arial&quot;,&quot;sans-serif&quot;;color:#005A83;"><a href="https://www.spectrumgeo.com" target="_blank"><span style="color:#005A83;text-decoration:none;">spectrumgeo.com</span></a></span><span style="font-size:12.0pt;font-family:&quot;Times New Roman&quot;,&quot;serif&quot;;"></span></p>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
<td style="padding:0cm 0cm 0cm 0cm;">
<table class="ecxMsoNormalTable" border="0" cellpadding="0">
<tbody>
<tr>
<td style="padding:0cm 0cm 0cm 0cm;">
<p class="ecxMsoNormal" style="line-height:17.25pt;"><span style="font-size:8.0pt;font-family:&quot;Arial&quot;,&quot;sans-serif&quot;;color:#005A83;">&nbsp; Dukes Court, Dukes Street, Woking, Surrey, GU21 5BH, UK</span><span style="font-size:12.0pt;font-family:&quot;Times New Roman&quot;,&quot;serif&quot;;"></span></p>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
<td style="padding:0cm 0cm 0cm 0cm;">
<table class="ecxMsoNormalTable" border="0" cellpadding="0">
<tbody>
<tr>
<td style="padding:0cm 0cm 0cm 0cm;">
<p class="ecxMsoNormal"><span style="font-size:8.0pt;font-family:&quot;Arial&quot;,&quot;sans-serif&quot;;color:#005A83;">&nbsp; follow us on •
<a href="https://twitter.com/SpectrumASA" target="_blank"><span style="color:#00B0ED;text-decoration:none;">twitter
</span></a>• <a href="https://www.facebook.com/spectrum.geo" target="_blank"><span style="color:#3B5998;text-decoration:none;">facebook
</span></a>• <a href="https://www.linkedin.com/company/spectrum-asa" target="_blank"><span style="color:#0077B5;text-decoration:none;">linkedin</span></a>
</span><span style="font-size:12.0pt;font-family:&quot;Times New Roman&quot;,&quot;serif&quot;;"></span></p>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
<p class="ecxMsoNormal">&nbsp;</p>
</div>

如果您点击此链接,则没有任何更新 Hotmail adding p tags within email, creating unwanted spacing 。链接很旧,所以如果有解决方案,如果有人可以分享他们的代码,那就太好了。

【问题讨论】:

  • 你能从outlook.com(hotmail)发布问题HTML吗?
  • 我已经添加了html代码
  • 好吧,这并没有真正的帮助。我需要在 Outlook 发送 HTML 后查看 HTML,或者 HTML Outlook.com 从&lt;div id="bodyreadMessagePartBodyControl363f"... 获取
  • 另外,你为什么将你的样式包装在 HTML 注释中?
  • 我已经添加了来自 hotmail 的 html。我在很多地方读过它,并看到了带引号的例子

标签: outlook html-email hotmail


【解决方案1】:

Outlook 发送&lt;p class="MsoNormal"&gt; 标签,Outlook.com 将ecx 添加到类和额外的填充中。

.ecxMsoNormal{padding:0; margin:0;} 添加到您的style 标记中。

【讨论】:

  • 我已经尝试过了,我已经从谷歌搜索结果中读取了 Outlook 删除了所有 html style 标签并且我认为不支持 margin ovverride。
  • Outlook.com 和 Outlook(应用程序)都支持 style 标记。尝试在 Outlook(应用程序)中向自己发送电子邮件,看看是否会发生同样的事情。您还没有说明您从哪个版本的 Outlook(2007、2010、2013、365)发送。
  • 我的措辞有误,我的意思是hotmail,抱歉。问题已更新
猜你喜欢
  • 2015-08-04
  • 2011-07-12
  • 1970-01-01
  • 2023-03-09
  • 2013-11-17
  • 2016-05-28
  • 2020-07-23
  • 2013-03-16
  • 2017-05-30
相关资源
最近更新 更多