Outlook 2010不包含签名中的样式标记

Wil*_*vin 10 html outlook html-email outlook-2010 responsive-design

我有问题为Outlook创建HTML签名电子邮件.

签名前我有一个样式标签,并为响应式电子邮件添加媒体宽度.

<style type="text/css">
div, p, a, li, td { -webkit-text-size-adjust:none; }

table {
min-width:650px;
}

@media only screen and (max-device-width: 480px) {
td[class=hidden-phone] {
    width: 0px !important;
    display: none !important;
    overflow: hidden !important;
    float: left !important;
}
td[class=description] {
    width: 100% !important;
}

td[class=visible-phone] {
    display: block !important;
    width: auto !important;
    height: auto !important;
    overflow: visible !important;
    float:none !important;
}
table {
    min-width: auto !important;
}
}
</style>

<table width="100%" style="font-family:'arial';">
<tr>
<td colspan="4" width="100%" style="height:10px;border-bottom:2px solid #96999e;height:0px;">&nbsp;</td>
</tr>
<tr>
<td style="padding:10px;width:80px;min-width:80px;"><img src="http://urbanangles.com/fileserver/gallery/[[ID]]_original.png" /></td>
<td class="description" valign="bottom" style="padding:10px 0 10px 10px;width:170px;color:#111;min-width:170px;line-height:11px;">
    <span style="font-size:11px"><strong>[[NAME]]</strong></span><br/>
    <span style="font-size:11px;color:#007dc3;">[[TITLE]]</span><div style="margin-bottom:5px;"></div>
    <span style="font-size:9px;">A Studio</span><br/>
    <span style="font-size:9px;">10 Somewhere St, Suburb, STA&nbsp;1234</span><br/>
    <span style="font-size:9px;margin-right:10px;">D&nbsp;&nbsp;</span><span style="font-size:9px;">[[DIRECT]]</span><br/>
    <span style="font-size:9px;margin-right:10px;">P&nbsp;&nbsp;</span><span style="font-size:9px;">[[PHONE]]</span><br/>
    <span style="font-size:9px;margin-right:9px;">M&nbsp;&nbsp;</span><span style="font-size:9px;">[[MOBILE]]</span><br/>
    <span style="font-size:9px;margin-right:10px;">E&nbsp;&nbsp;</span><span style="font-size:9px;"><a href="mailto:[[EMAIL]]" style="color:#111;text-decoration:none;">[[EMAIL]]</a></span><div style="margin-bottom:5px;height:0px;"></div>
    <span style="font-size:11px"><strong><a style="color:#111;text-decoration:none;" href="http://www.examples.com">www.examples.com</a></strong></span><br/>
</td>
<td class="hidden-phone" style="width:100%;"></td>
<td class="hidden-phone" valign="bottom" style="padding:10px 10px 10px 0;width:360px;min-width:360px;"><span style="margin-right:15px;"><a href="http://www.facebook.com/urbanangles" style="margin-right:3px;"><img src="http://william.uadev.com.au/img/facebook.jpg" /></a>&nbsp;<a href="http://www.twitter.com/urban_angles"><img src="http://william.uadev.com.au/img/twitter.jpg" /></a></span>&nbsp;&nbsp;<a href="http://www.urbanangles.com"><img src="http://william.uadev.com.au/img/logo.jpg" /></a>    </td>
 </tr>
 <!--[if !mso 9]><!-->
 <tr>
<td colspan="1" width="100%" class="visible-phone" style="max-height:0;display:none;height:0;overflow:hidden;width:0;float:left">
    <span style="margin-left:10px;margin-right:25px;">
    <a href="http://www.facebook.com/examples" style="margin-right:5px;"><img src="http://william.uadev.com.au/img/facebook.jpg" /></a>
    <a href="http://www.twitter.com/examples"><img src="http://william.uadev.com.au/img/twitter.jpg" /></a></span>
</td>
<td colspan="3" width="100%" class="visible-phone" style="max-height:0;display:none;height:0;overflow:hidden;width:0;float:left">
    <a href="http://www.urbanangles.com"><img src="http://william.uadev.com.au/img/logo" style="width:80%;margin-left:8px;" /></a>
</td>
</tr>
<!--<![endif]-->
<tr><td colspan="4" width="100%" style="height:10px;border-top:2px solid #96999e;"></td>   </tr>
</table>

<p  style="font-size:11px;font-family:'arial';margin:0 0 5px 0;padding:0"><i>Please consider the environment before printing this email.</i></p>

<p style="font-size:9px;font-family:'arial';color:#999;margin:0 0 5px 0;padding:0">This email and any attachment(s) is intended only for the exclusive and confidential use of the addressee(s). If you are not the intended recipient, any use, interference with, disclosure or copying of this material is unauthorised and prohibited. If you have received this message in error, please notify the sender by return email immediately and delete the message from your computer without making any copies. [[COMPANY]] does not guarantee the integrity of any emails or attached files.</p>
Run Code Online (Sandbox Code Playgroud)

苹果邮件上的一切都运行正常.但是,我的HTML看起来并不满意.来自outlook的所有电子邮件都没有样式标签,这使得我的html在iphone上看起来很奇怪.

我的问题:

  1. 为什么样式标签不包含在我的电子邮件中?据我所知,它在outlook中受到支持.见这里的参考

  2. 我可以做任何工作或修复吗?我希望在iPhone上有响应式电子邮件工作,我知道如果我从Apple Mail发送它就可以了.

干杯,威尔

Joh*_*ohn 1

如果样式标签没有出现在您的电子邮件代码中,可能是因为它不在头部。不确定 Outlook 是否需要此功能,但这可能就是它被删除的原因。