2013-02-01 40 views
10

我有問題可以爲Outlook創建HTML簽名電子郵件。Outlook 2010不包含簽名中的樣式標籤

我在簽名前有一個樣式標籤,併爲響應電子郵件添加媒體寬度。

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

我得到了一切正常工作蘋果郵件。不過,outlook對我的html並不滿意。從Outlook的所有電子郵件將不會有風格標籤,這使我的HTML看起來奇怪在iphone上。

我的問題:

  1. 爲什麼樣式標記不包括在我的電子郵件?從我所瞭解的情況來看,這是支持前景的。請參閱參考here

  2. 是否有任何解決方法或修復,我可以做?我很想在iPhone上做出響應式電子郵件工作,我知道如果我從Apple Mail發送它,它就能正常工作。

乾杯, 威爾

+0

你能提供html嗎? – samanthasquared

+0

從您在#1中提供的文檔中,Outlook不支持您聲明CSS的方法。 E [foo =「bar」] vs E.foo – samanthasquared

回答

1

如果樣式標籤沒有在你的電子郵件的代碼出現,這可能是因爲它不是在頭部。不知道這是否需要Outlook,但這可能是它被剝離的原因。

+0

感謝您的回覆。但是是否可以從簽名中添加風格?我嘗試了幾種不同的方式,但沒有運氣。 –

+0

您可以嘗試在電子郵件的頂部添加一些代碼,但這會使其不在簽名中。不幸的是,我認爲你可能會與一場失敗的戰鬥搏鬥 – John

1

<style>標籤是由一些電子郵件客戶端(如Gmail)剝離出來,(也許Outlook正在做同樣的?)

相反,你應該使用在線風格。

從同一個網站你報,準則使用樣式:http://www.campaignmonitor.com/resources/will-it-work/guidelines/

您可以使用http://premailer.dialect.ca/您signiture轉換爲嵌入式樣式,它的免費:)

+0

嗨,謝謝你的答案。我在html中使用內聯樣式。但是,我需要爲需要媒體查詢的公司提供響應式簽名。我不認爲(或知道)媒體查詢可以附加爲內聯樣式。我知道這不適用於所有的電子郵件客戶端,但我只關心IOS設備,正如我上面所述。 –

+0

應該沒問題,試試吧,讓我們知道發生了什麼 –

0

你應該總是使用內聯用於HTML電子郵件的樣式,因爲這可以提供與不同客戶端的最大兼容性。我知道它不像單獨的CSS塊那麼好,但事實就是如此。