HBuilder webApp开发(十五)MUI增加自定义icon图标

前段时间有朋友问我，MUI里面怎么添加字体图标。后来下班后给他做了一个小的Demo，其实这个看卡MUI的文档就有。mui如何增加自定义icon图标。
其实这个不仅限于MUI，其他项目比如PC项目也可以这个做。
具体步骤：

登录iconfont

添加到购物车

下载代码

提取有用代码

源文件：

这里我们只需要 样式文件:iconfont.css

字体文件:iconfont.ttf

其他格式的字体文件iconfont.wofficonfont.eoticonfont.svg
然后把这两个文件拖进项目目录，结果如图：

修改样式文件iconfont.css

修改前：

修改后：

使用

在html文件中引入iconfont.css文件，

link rel="stylesheet" href="css/iconfont.css"

使用：

<span class="iconfont icon-home" style="height: 40px; width: 40px;"></span>

效果