跨電子郵件客戶端可靠地使用'字體重量：打火機'或'字體重量：100'

我有一個標題，我試圖用font-family: helvetica neue; font-weight: 100;這看起來很棒的網頁版本，但在大多數電子郵件客戶端出現font-weight: normal;。跨電子郵件客戶端可靠地使用'字體重量：打火機'或'字體重量：100'

我在Hubspot內部發送這些郵件。

<table border="0" width="100%" cellspacing="0" cellpadding="0"> 
    <tbody> 
    <tr> 
    <td class="headlineOne" style="color: #000000; font-family: helvetica 
    neue, 
    helvetica, arial, sans-serif; font-weight: 100; font-size: 44px; text- 
    align: left; line-height: 44px;">It's never too early</td> 
    </tr> 
    <tr> 
    <td class="headlineTwo body-text" style="line-height: 41px; margin-top: 
    0; font-size: 41px; text-align: right; font-weight: 200; padding- 
    right: 99px; font-family: helvetica neue, helvetica, arial, sans- 
    serif; color: #4a4646; padding-bottom: 0px;">to start saving</td> 
    </tr> 
    </tbody> 
    </table>

來源

2017-10-12 Arren Propster

定義可靠，請記住，所有瀏覽器和用戶代理根據W3C規範顯示CSS和HTML以解釋他們自己的解釋。測試所有可能的用戶代理是不可能的。 – TidyDev

Helvetica Neue不是一個網絡安全的字體，所以你在大多數電子郵件客戶端看到的是Helvetica。要使用Helvetica Neue，您需要使用@import或鏈接在<head>中創建鏈接，以使其在電子郵件中工作。你還需要鏈接到一個webfont。

即使使用webfont，Helvetica Neue也不能在Gmail或Outlook中工作。 Gmail不支持網頁字體，Outlook似乎忽略名稱中帶有空格的字體。

您已經發現使用Helvetica作爲Helvetica Neue的備份字體的問題，這是字體有不同的尺寸，因此當您在兩個不同的客戶端（如Apple Mail和Gmail）中查看電子郵件時，您會看到不同的外觀。

如果您使用Font-weight: 100;最輕的Neue看起來不會像Helvetica一樣。如果該變化不會影響電子郵件的佈局，請使用Helvetica作爲回退。否則，請嘗試另一種可能更符合您需求的網頁安全字體。例如，Lucida Grande，Trebuchet MS可能是更好的後備字體。

欲瞭解更多信息，請查看此鏈接：

終極指南Web字體

https://litmus.com/blog/the-ultimate-guide-to-web-fonts

其他有用的資源：

好運。

來源

2017-10-13 01:14:25 gwally

跨電子郵件客戶端可靠地使用'字體重量：打火機'或'字體重量：100'

回答

相關問題