最近在用D廠的Hbuilder這款I(lǐng)DE贬养，可以做跨平臺(tái)移動(dòng)開發(fā)匈庭。在學(xué)習(xí)H5的道路上摸索撞墻ing...
這次是在做跨平臺(tái)的小應(yīng)用的嘗試褐桌，也是對(duì)Hbuilder的熟悉使用中亩歹，腦子不好使，所以記點(diǎn)筆記胸墙。（也可能不準(zhǔn)確我注，但是自己測(cè)試好用...）
如何新增替換mui框架中的icon圖標(biāo)
一、官方教程上少了幾句話迟隅，可能導(dǎo)致替換或新增之后圖標(biāo)沒有顯示出來，下方的評(píng)論里已經(jīng)有老司機(jī)指出來了励七，這里記錄一下
按照官方文檔集成之后圖片還沒有顯示出來的話智袭，檢查一下以下幾點(diǎn)
1.是否在<head>標(biāo)簽中 <link>了字體的css文件
2.按照教程修改css文件的時(shí)候，上部應(yīng)該是如下這種格式：
@font-face {font-family: "iconfont";
src:url('../fonts/iconfont.ttf') format('truetype'); /* chrome, firefox, opera, Safari, Android, iOS 4.2+*/
}
主要檢查前面的src:是否被不小心刪除掠抬； 語(yǔ)句末尾的逗號(hào)“吼野，” 應(yīng)該刪除或者替換成分號(hào) ；
二两波、官方文檔的評(píng)論里有同學(xué)說如果一個(gè)圖標(biāo)需要引用一次css文件和ttf文件瞳步。每次下載的圖標(biāo)字體文件命名都是iconfont，那需要多個(gè)圖標(biāo)的時(shí)候怎么辦腰奋。
1.首先单起，如果你一次性下載很多圖標(biāo)的話，這些圖標(biāo)最后會(huì)打包成一套劣坊，最后生成一個(gè)css和ttf文件嘀倒，這樣就是很多圖標(biāo)在一起了。
2.如果分幾次在不同網(wǎng)站下載的，我嘗試過把多個(gè)自定義的圖標(biāo)css和ttf文件合并测蘑，然而并沒有成功...
那你說咋辦灌危，改名唄...筆記如下...
需要多個(gè)圖標(biāo)的時(shí)候，每個(gè)圖標(biāo)下載完之后碳胳，第一件事先把css和ttf的文件名修改成你想要的文件名勇蝙。
以下圖片，對(duì)應(yīng)的各個(gè)名字我都用相同的顏色和備注標(biāo)注了挨约。
例如圖1,將修改名字后的文件放入對(duì)應(yīng)文件夾中并在index中引用改名后的css文件：
1.修改文件并引用css文件.png
圖2為css文件內(nèi)部：
粉色為font-family name浅蚪，跟下方的font-family 保持一致就好
紅色是圖一中修改的ttf文件名字
白色 是圖標(biāo)字體的父 名稱，調(diào)用圖標(biāo)字體的時(shí)候需要烫罩，一會(huì)見圖3
藍(lán)色 是圖標(biāo)字體的名稱惜傲，調(diào)用圖標(biāo)字體的時(shí)候需要，一會(huì)見圖3
2.在css文件中根據(jù)修改后的名字引用ttf文件.png
圖3是index.html文件內(nèi)部贝攒，調(diào)用新的圖標(biāo)字體
白色 是圖標(biāo)字體的父 名稱盗誊，對(duì)應(yīng)圖2白色
藍(lán)色 是圖標(biāo)字體名稱 ，對(duì)應(yīng)圖2藍(lán)色
3.調(diào)用圖標(biāo)字體.png
以此類推隘弊，需要添加多個(gè)圖標(biāo)字體的話哈踱，這樣操作就可以了。
三張圖中對(duì)應(yīng)顏色的名稱都可以成對(duì)的隨意修改梨熙。
