iconfont如何在原先的圖標中,增加新的圖標

第一步 下載樣式
http://www.iconfont.cn/ 
選擇圖表,點擊加入購物車

第二步 解壓下載文件到項目 css中

這裏其實可以不用將下載中的所有文件全部放入你的實際項目,在首次添加到實際項目中有iconfont.css和iconfont.js就可以了,而後面添加新的圖標只要更新css文件就好(參考網址中也有講到)。

第三步 修改文件名稱 與 iconfont.css 文件名路徑

這裏的@font-face內容中的文件名必須要改,否則會跟原先的衝突,導致新的圖標無法引用,@font-face內容可在下載文件中的iconfont.css文件中查看和修改,下面的字體編碼的定義也在iconfont.css中

第四步 將@font-face 拷貝到項目中的原 iconfont.css 中


第五步
.icon-icongerenjishiben:before { content: “\e6a3”; }

.icon-ruiyanshicai05:before { content: “\e61a”; }

.icon-cehuixiaoheditumoshi:before { content: “\e631”; }

將相應圖標的字體編碼寫入原 iconfont.css 中 調用即可

如何在頁面上調用可查看下面的網站

參考網站:

https://www.cnblogs.com/fashandian/p/6880892.html(如何使用iconfont)

https://blog.csdn.net/DreamITEffort/article/details/84581317

 

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章