瀏覽器根據font-family解析渲染為不同圖形的過程：

1：讀取文字內容轉換成對應的 unicode碼()

計算機操作系統里面每個字符都有一個unicode編碼,比如我們在web上輸入\u6211跟輸入“我”是一樣的，因為「我」的unicode是\u6211(16進制)，瀏覽器會自動幫你找到對應的圖形去渲染。而字體文件的作用是規定某個字符應該用什么形狀來顯示。unicode字符集里面，E000 至 F8FF屬于用戶造字區。原本是空的，用戶可以在字體文件里面隨便定義這些字符的形狀，通過項目引入加載去找到自定義字符，這就和使用操作系統的字體是一樣的了。

2：根據HTML里設置的 font-family (如果沒設置則使用瀏覽器默認設置)即去查找電腦里(如果有自定義字體@font-face ，則加載對應字體文件)對應字體的字體文件

比如：現在有個自定義圖標文件(unicode一定在E000 至 F8FF范圍內！)，現在我手動添加一個操作系統字體“我”，如下圖

圖標文件庫2.png

在HTML里面這樣用：

瀏覽器效果：

瀏覽器效果.png

瀏覽器效果展示是一樣的，只不過一個是從引入的文件里面去找，一個直接指定了操作系統的文字。

3：找到文件后根據 unicode 碼去查找繪制外形，找到后繪制到頁面上。

創作挑戰賽新人創作獎勵來咯，堅持創作打卡瓜分現金大獎

總結

以上是生活随笔為你收集整理的计算机字体原理,字体图标生成原理（1）的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。