在參考（copy）別人網站設計的時候發現了：Font Awesome

在作項目前端的時候，要實現顯示博文，但要怎樣設計沒個好的想法

因而就百度找別人的博客進行參考，發現了一個很合心意的設計

其中博文的時間和標籤前有個小圖標，當時我在想這應該是個img標籤裏放了個小圖標。

 

結果在copy的時候發現了，這個效果是用：：before僞類裏添加content: " \f02c";來實現的...

很懵這個\f02c是什麼玩意？

百度了一下：https://zhidao.baidu.com/question/1639884906094172020.html

發現大概是一個字體被設計成圖標的樣子，使用這個字其實就至關於使用一個圖標。

這就厲害了，這樣網站中常用到的小圖標豈不是無需使用圖片就能夠實現了？直接用這種圖標文字就好了。

 

因而乎興沖沖的複製了before裏的樣式，固然font-family: FontAwesome;這個也沒放過。

可是立馬就出問題了，頁面中沒有給我顯示出正常的圖標，顯示的是一個白框框。

 

我知道大概是使用姿式不對，因而乎繼續百度，發現原來是Font Awesome這麼個東西。

進到中文網：http://www.fontawesome.com.cn/，按照說明下載了Font Awesome，發現是一個文件夾，裏面又是CSS、又是字體的。

哇，我只想用兩個小圖標而已，使用起來那麼麻煩嗎？好像還須要給項目裏引用CSS才行，我已萌生退意...

 

不過想到以前看的一個文章說，若是不用Font Awesome的類，直接用小圖標的話引入一個字體文件就好了。

因而乎在中文網那裏看了看，用CND的方式，在項目head裏引入一個js文件就能夠使用了

http://www.fontawesome.com.cn/get-started/

 

自此效果終於實現了，而我也很困了，sleep