把網上的項目中字體通過鏈接保存下來在本地上使用,在本地服務器上運行站點發現,用Chrome瀏覽器訪問的時候,出現錯誤提示不能正常顯示字體,怎么解決呢,看看怎么搞。
文章目錄
- 發現問題
- 提示警告
- 提示錯誤
- 字體檢查
- 打開文件
- 文件大小
- 解決問題
發現問題
提示警告
打開Chrome瀏覽器的開發工具,在Console面板下,顯示?提示,如下圖
報錯內容Failed to decode downloaded font: ...
這是什么意思呢,
提示錯誤
如果是火狐瀏覽器的話,在Console面板下,報錯提示會是另一個樣,如下圖
報錯內容downloadable font: rejected by sanitizer (font-family: "element-icons" style:normal weight:400 stretch:100 src index:1) source:...
這又是什么意思呢,
看鏈接地址是沒有問題的,經過驗證,發現字體文件是損壞的,
字體檢查
之前在Chrome瀏覽器里面看著能預覽字體,如下圖
看著是正常的,就沒有懷疑過文件是損壞的(
Chrome瀏覽器會盡一切可能預覽字體) =.=
打開文件
用這個transfonter在線轉換工具的Webfont generator字體功能,
就可以發現,如下圖所示
提示Font file is corrupted (字體文件已損壞)
文件大小
其實還有一個方式可以驗證文件是否損壞,
通過對比保存下來的文件大小,如大小不一致那就是損壞的文件
解決問題
發現了問題(出坑 ),重新找個一樣的文件(沒問題)覆蓋就好,
寫到最后,遇到同樣的問題的讀者,可以試一下