首先要下载图标
将图标放入目录
不要放在assets目录下,uniapp开发的微信小程序打包时可能会过滤掉。
修改iconfont.css文件
将目录加入到css的字体目录中。
@font-face {
font-family: "iconfont"; /* Project id 3184571 */
src: url('@/icon/iconfont.woff2?t=1644910253242') format('woff2'),
url('@/icon/iconfont.woff?t=1644910253242') format('woff'),
url('@/icon/iconfont.ttf?t=1644910253242') format('truetype');
}
.iconfont {
font-family: "iconfont" !important;
font-size: 16px;
font-style: normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.icon-jiantou_zuoyouqiehuan:before {
content: "\eb0d";
}
引入
在app.vue文件中引入
<style>
@import url("@/icon/iconfont.css");
</style>
使用
<text class="icon iconfont icon-jiantou_zuoyouqiehuan"></text>