圖標字體：某些圖標作爲文本顯示在我的機器上

Question

這是關於我的機器如何看到網頁而不是個人網站項目的問題。 在我的機器上，一些圖標字體顯示爲文字文本（圖標的名稱），而不是圖形圖標本身。

環境公司

• 的MacBook Pro（視網膜，13英寸，2015年年初）
• MacOS的塞拉利昂10.12.3
• 在其最新版本
使用Chrome，Safari和Firefox瀏覽器破天

還

• 我用一個體面的互聯網聯接和字體文件不加載失敗
• 我不使用代理服務器不住在中國
• 禁用所有瀏覽器擴展時，問題仍然發生。
• 編輯：我沒有在瀏覽器控制檯中的任何錯誤/警告。

例如，這是我看到https://developers.google.com/web/

和https://material.io/icons/

任何幫助理解

Answer 1

OP已示出的網頁經由Google Web Fonts使用Material Icons字體。他們爲像一個CSS文件：

@font-face { 
    font-family: 'Material Icons'; 
    font-style: normal; 
    font-weight: 400; 
    src: local('Material Icons'), 
     local('MaterialIcons-Regular'), 
     url(https://fonts.gstatic.com/s/materialicons/v21/2fcrYFNaTjcS6g4U3t-Y5UEw0lE80llgEseQY3FEmqw.woff2) format('woff2'); 
} 

.material-icons { 
    font-family: 'Material Icons'; 
    ... 
} 

它總是試圖首先加載「材料圖標」字型的本地版本中，Web字體之前。因此，如果OP有outdated或「材料圖標」的自定義版本，則不會顯示所需的效果。

若要解決此問題，請刪除本地「材料圖標」字體，或者如果您仍想要本地副本，請將其替換爲latest version。