贵有恒,何必三更起、五更眠、最无益,只怕一日曝、十日寒。这篇文章主要讲述uniapp中使用阿里巴巴图标iconfont相关的知识,希望能为你提供帮助。
uniapp本地使用iconfont
iconfont:https://www.iconfont.cn
从iconfont中选择图标,下载之后解压缩包,保留
iconfont.css、iconfont.ttf
将此文件拷贝到uniapp目录中(我是拷贝到colorui目录下)
iconfont.css中要修改
@font-face {font-family: "z_iconfont";
/*默认值是iconfont,但好像说 iconfont 是 uni 的关键字暂不能用,所以我自己项目那边改为z_iconfont*/
src:
url(‘iconfont.ttf?t=1592624240199‘) format(‘truetype‘) /* chrome, firefox, opera, Safari, android, ios 4.2+ */
}
.iconfont {
font-family: "z_iconfont" !important;
/*这里也要改*/
font-size: 16px;
font-style: normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
然后在main.js文件中import
import z_iconfont from ‘./colorui/iconfont/iconfont.css‘
然后就可以直接在项目中使用
【uniapp中使用阿里巴巴图标iconfont】<
span class="iconfont icon-tubiao5 text-orange">
<
/span>
推荐阅读
- SAS函数用法详细图解
- 如何在Windows 10上安装.Appx或.AppxBundle软件
- Appium查看应用包名
- Spring Boot 之Application.properties配置大全
- Android中的进程与线程
- This application failed to start because no Qt platform plugin could be initialized
- ImportError: cannot import name '_overlapped'
- Android 事件传递机制进阶
- Centos中使用virtualenvwrapper