在html5中，字體圖示是在Web專案中使用的圖示字體，其本質就是一種特殊的字體，透過這種字體，顯示給使用者的就像一個個圖片一樣。字體圖示可以像文字一樣，隨意透過CSS來控制它的大小和顏色，對於建立網站來說，非常方便。
本教學操作環境：windows7系統、CSS3&&HTML5版、Dell G3電腦。
什麼是字體圖示？
字體圖示簡單的說，就是一種特殊的字體，透過這種字體，顯示給使用者的就像一個個圖片一樣。字體圖示最大的好處，在於它不會變形和載入速度快。字體圖示可以像文字一樣，隨意透過 CSS來控制它的大小和顏色，對於建立網站來說，非常方便。
字體圖示是使用微小圖像而不是字母形式的字體。與字元一樣，每個圖示字體都是向量元素，可根據需要進行伸縮，並可以使用CSS樣式進行修改。
使用圖示字體的主要原因是你可以輕鬆更改大小，顏色，形狀。圖示字體本質上是透明的，因此你可以將它們放在任何顏色或類型的背景上，也可以添加筆觸或更改圖示的不透明度。
所有的設定操作均可以使用CSS完成，因此你不必為設計中的每個新圖示實例創建唯一的圖像(這對於保持網站設計和程式碼的輕量級非常有用)。
圖示字體是向量圖像，這意味著它們是可隨意進行縮放而不失真的。與其他字體一樣，你可以根據需要將它們設定更大或更小。僅將圖標字體用作藝術元素，甚至在其他文字欄位中。
使用字型圖示的優缺點
1、優勢
只要CSS中存在對應的類，圖示就容易縮放;
你可以在網路上輕鬆取得既有的大型圖示庫;
#更改圖示屬性非常容易，無論你使用什麼來建立網站的;
將圖示新增到網站設計上的任何頁面都很容易(只需插入圖示名稱);
有數千種各種樣式的圖示可供選擇;
#如果需要更高的自訂，甚至可以創建自己的圖示字體。
2、劣勢
#圖示是單色或漸層色(在大多數情況下，不過一些可以提供更多自訂選項的服務正在改變這一點);
如果無法載入到圖示字體，則沒有其他的備用字體可供使用;
#你可能不需要完整的圖示集;
有些瀏覽器器還不能或不完全支援圖示字型;
#你可能找不到適合你的需求的資源。
取得字體圖示有兩種方式
阿里向量圖示官網：www.iconfont.cn(推薦)
國外網站：http://icomoon.io
如何使用字體圖示？
由於國外的這個網站加載速度慢，在這裡我用阿里提供的圖標庫來進行演示
（1）在瀏覽器中搜索iconfont ,找到阿里巴巴向量圖示庫官網,然後註冊登錄，如之前有註冊過，此步驟跳過;
（2）把滑鼠移入到圖示庫， 有一個下拉列表，選擇官方圖示庫;
（3）點選清單中的第一個圖示庫， 開啟一個新頁面， 並把自己喜歡的圖示加入到庫裡面;
加入到庫：
#（4）右上角有一個類似購物車，你加入庫裡面的字體圖示全部在裡面;
（5）點擊加入到項目
接著網頁會自動跳到對應的項目裡了,如圖:
下載至本機：(最關鍵的步驟)
下載下來解壓縮後的檔案如下:
以上是html5中什麼是字體圖標的詳細內容。更多資訊請關注PHP中文網其他相關文章！
