uni-app中引⼊iconfont字体图标的使⽤教程（超详解）。
1.⾸先来到阿⾥云的iconfont⽮量图标库搜索你想要的字体图标，然后添加⼊库，点击右下⾓的购物车按钮。
2.点击添加⾄项⽬
3.点击确认
4.点击下载⾄本地
5.在uni-app项⽬中的static静态资源⽬录下，新建⼀个fonts⽬录,⽤于存放字体图标的相关样式⽂件。
6.解压我们所需要的字体图标相关⽂件⾄/static/fonts⽬录下。
7.如果我们希望字体图标在全局⽣效，那就应该在app.vue中全局引⼊刚刚解压的iconfont.css样式表。
icon图标库
8.然后我们会看到这样的报错。
9.打开iconfont.css外部样式表，我们可以看到⽂件路径都对不上，需要修改。
10.拼接上我们正确的路径~@/static/fonts，注意第三⾏这个url不需要加路径。
11.现在我们可以在任意页⾯使⽤我们的字体图标了，⽐如我们在index.vue页⾯使⽤字体图标。
我们回到刚刚下载好的字体图标⽂件压缩包，到这个demo_index.html⽂件，它就是我们的说明书了，打开它看看。
在选项卡中选中Font class
往下拉，到⽤法说明
哦，我们明⽩了，亲⾃回到⾃⼰项⽬操作下吧。
在XXX后⾯填⼊这个图标的名称。
注意事项：
12.⽹页预览效果。
拓展：后⾯添加进来的图标要这样操作，分号结束上⼀部分，src带出新加进来的icon

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。