layui2.0及之前版本的字體圖標不能知足項目的需求,其圖標來源於阿里巴巴www.iconfont.cn,因此本身手動豐富了項目字體圖標庫,記錄以下。css
一、添加字體圖標至購物車html
打開www.iconfont.cn,選擇中意的字體圖標庫,添加至"庫"(即字體購物車圖標),以下圖所示 web
二、將圖標添加至項目瀏覽器
點擊右側「購物車圖標」,而後將選中的字體圖標添加至項目。建議新建項目,方便之後擴展。字體
三、下載並引入代碼ui
在項目中,點擊"下載至本地",而後將解壓的文件複製到本地的項目中,並在本地引入 iconfont.css 文件便可。code
四、選擇字體圖標orm
在瀏覽器中打開,demo_unicode.html文件,按照文件提示,在本地項目引入相關html代碼便可。
如 <i class="iconfont">3</i>htm
如果layui,爲樣式美觀,可修改iconfont.css的修改css代碼以下圖片
.iconfont{font-family:"iconfont" !important; font-style:normal; -webkit-font-smoothing: antialiased; display: inline-block; -webkit-text-stroke-width: 0.2px; font-size:14px; transition: all 0.4s linear 0s;-o-transition: all 0.2s linear 0s;-moz-transition: all 0.2s linear 0s; }
五、之後若須要再添加字體圖標,重複上述步驟,直接在阿里巴巴iconfont下載項目代碼至本地,覆蓋以往的代碼(iconfont.css 除外),便可使用新的字體圖標。