在網頁中，存在圖標在鼠標經過的時候改變顏色的情況：
正常狀態(tài)
鼠標移入后狀態(tài)
說明它并不是一個圖片而是一個文字，這種文字就是用字體設置工具做成然后在做成字體文件安裝到我們的電腦上顯示完成。
背景：
還記得非主流時期那種bolingboling的個性簽府怯，因為之前的網頁顯示都是中規(guī)中矩的宋體、楷體跨新、黑體·······等，為了美化我們的頁面這種潮流便應運而生了坏逢。但是當時要完成這種效果只能通過把文字做成圖片進行切圖也就是web-safe的方法域帐，這樣一來整個網頁會很大，在那個網費很貴網速有限的年代里加載一個頁面變得非常的吃力是整。而現(xiàn)在我們的CSS3就提供了一個功能肖揣，允許網頁設計師導入一些好看的字體文件，這里面的文字看起來像是一個圖片其實是一些適量的文字浮入。
語法：
@font-face規(guī)則
在CSS3之前，web設計師必須使用用戶電腦上安裝好的字體，但是有了CSS3設計師可以使用任何的字體螟够。原理大概就是設計師可以先把字體存放到web服務器上面怕品，在用戶打開你的網頁的時候瀏覽器自動下載到用戶的電腦上這樣用戶看到的字體便是設計的字體。
用法：
首先先去下載一種自己喜歡的字體文件易迹，這里推薦阿里爸爸家的矢量圖標網站宰衙，全是免費的，下載代碼之后會有一個文件教你怎么去用睹欲。
自帶教程文件
以下被選中的文件是字體供炼，后綴不一樣代表支持的瀏覽器不一樣，我們需要全部使用窘疮。
字體
這里就給操作一下：
1袋哼、首先在引入字體，這里我們必須給字體設置一個名稱闸衫，mumu是我亂取的名字涛贯。每一個格式的我們都得引入。
引入字體
網頁中使用它
從demo中找到自己想要得圖標的unicode碼
demo就是剛才的字體自帶教程文件
然后我們進行調用
直接輸入unicode編碼
最后呈現(xiàn)在網頁上的效果就是下面這樣：
最終效果
2蔚出、當然我們不用那么麻煩疫蔓，可以直接用link
link方法，直接用下載的字體里自帶的css文件身冬。
