Outlook 2007/2013 non mostra dichiarazioni CSS font-famiglia

Question

Sto testando un design di email con Litmus e per la vita di me non riesco a impostare correttamente i miei font in Outlook 2007/2010/2013. Ogni singolo HTML/CSS trucco/trucco continua a rendere in Times New Roman:

`

sono per lo più utilizzando semplici tabelle per il layout, quindi tutti i contenuti sono in ultima analisi, all'interno di un elemento TD.

Ecco le varie tecniche che ho provato a impostare il carattere.

Dichiarazione My STYLE: Ho provato questo in entrambi i tag HEAD e BODY & né funziona.

<style> 
@font-face { 
    font-family: proxima-nova; 
    src: url('assets/ProximaNova-Reg.otf'); 
} 
@font-face { 
    font-family: proxima-nova-blk; 
    src: url('http://assets/ProximaNova-Black.otf'); 
} 
body *, td, p, li { 
    font-family: font-family:proxima-nova,'Proxima Nova Regular','Proxima Nova',verdana,sans-serif; 
} 
</style> 

attributo di stile CSS impostata su elementi TD: tag

<td style="font-family:proxima-nova,'Proxima Nova Regular','Proxima Nova',verdana,sans-serif; color:#FFFFFF; font-weight:300;font-size:18px;"> 

FONT con viso e gli attributi di stile insieme:

<font face="proxima-nova,Proxima Nova Regular,Proxima Nova,verdana,sans-serif" 
    style="font-size:28px; 
    font-family:proxima-nova,'Proxima Nova Regular','Proxima Nova',verdana,sans-serif;"> 

Inline CSS attributi di stile su tutti elementi di testo interni (P, LI, A):

Sono COMPLETAMENTE sconcertato. Su tutti gli altri clienti rilevanti tutto sta funzionando così come ci si può aspettare (vale a dire i caratteri sono rendering, come mi aspetto dato vari bug & weirdnesses di rendering), tra cui iOS, Gmail, Outlook 2003/Express, ecc .:

Answer 1

Ho rintracciato il problema nella mia dichiarazione STYLE, che utilizza @ font-face per inserire un file di font personalizzato per supportare i client (ad es. Apple). A quanto pare, qualcosa su questo uso delle pause dichiarazione @ font-face in Outlook 2007 - 20013.

<style> 
@font-face { 
    font-family: proxima-nova; 
    src: url('http://assets/ProximaNova-Reg.otf'); 
} 
@font-face { 
    font-family: proxima-nova-blk; 
    src: url('http://assets/ProximaNova-Black.otf'); 
} 
</style> 

avevo bisogno di MS Outlook di ignorare questo tag STYLE, quindi mi avvolse l'intero blocco con il tag [if !mso]:

<!--[if !mso]><!--> 
<style> 
@font-face { 
... 
} 
</style> 
<!--<![endif]--> 

Wow, mi stava facendo impazzire.

Answer 2

Ho provato la soluzione con il tag [if! Mso], ma per qualche motivo non funzionerebbe. Alla fine ho trovato una soluzione diversa:

È possibile utilizzare il tag font con l'attributo face per forzare il carattere di fallback corretto in client come Outlook 2007/2010/2013. Per esempio:

<td style="color:#FFFFFF; font-weight:300;font-size:18px;"> 
    <font face="proxima-nova,'Proxima Nova Regular','Proxima Nova',verdana,sans-serif" 
</td> 

Ho provato questo in tornasole e in Outlook 2007/2010/2013 sarebbe fallback a Verdana e nei clienti che fanno sostenere il carattere personalizzato, che avrebbe mostrato proxima-nova.

Spero che questo aiuti.