字型壓縮 字型引入,頁面載入問題

2021-09-23 20:33:35 字數 1050 閱讀 7528

昨天成功引入字型以為就大功告成了,但是又出了個小問題。

問題復現:

將檔案放在本地搭建的nginx伺服器上,頁面載入是沒有問題的。

但是將檔案放在伺服器上時,引入的字型檔案載入的超級超級慢,(截圖如下)

解決方法:

那就是需要將字型檔案壓縮,那麼問題來了,字型檔案要怎樣壓縮呢?

需要使用font-spider  ,見官網:       ,官網寫的很清楚,我還是在下面將我的步驟再次羅列下。

字型檔案壓縮詳細步驟:

(1)安裝nodejs  (可以檢查下看電腦上是否有安裝nodejs)

(2)執行如下命令:

(3)執行font-spider命令:

font-spider 資料夾目錄

到此,字型檔案就被壓縮了,然後原始檔被自動備份了。

這樣字型檔案就壓縮完事了。。。。

引入字型檔案  字型檔案引入

但是,又出現了乙個問題,字型被壓縮後,顯示出來的文字有點兒差錯,字型顯示不統一,這個問題暫時還沒有解決。

使用壓縮後的字型顯示如下:

專案中引入字型

font face html,body蘋方提供了六個字重,font family 定義如下 蘋方 簡 常規體 font family pingfangsc regular,sans serif 蘋方 簡 極細體 font family pingfangsc ultralight,sans serif...

UNIAPP 怎麼引入字型

第一種 網路字型位址 const url loadfontweb 第二種 本地字型位址 第一步 在字型檔案存放在static目錄下面 第二步 本地路徑需要使用絕對路徑,所以需要native的方法來 loadfontlocal success fail e 第三部 在css中對需要引用的字型 使用 f...

css引入外部字型

font face body 不同瀏覽器字型的格式有差別 字型字尾和瀏覽器有關,如下所示 ttf或.otf,適用於firefox 3.5 safari opera eot,適用於internet explorer 4.0 svg,適用於chrome iphone 比如 font face css3 ...