uni-app 如何引入Iconfont阿里巴巴矢量图标库
步骤如下
下载图标项目, 解压后效果如下
修改iconfont.css文件
修改前格式:
@font-face {font-family: "iconfont"; src: url('iconfont.eot?t=1605254910083'); /* IE9 */ src: url('iconfont.eot?t=1605254910083#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('data:application/x-font-woff2;charset=utf-8;base64,转换的base64内容') format('woff2'), url('iconfont.woff?t=1605254910083') format('woff'), url('iconfont.ttf?t=1605254910083') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+ */ url('iconfont.svg?t=1605254910083#iconfont') format('svg'); /* iOS 4.1- */ }
修改后格式:
@font-face { font-family: "iconfont"; src: url('data:application/x-font-woff2;charset=utf-8;base64,转换的base64内容') format('woff2'); }
Copy字体文件iconfont.ttf和样式文件iconfont.css 至UniApp项目static/font目录中
以上: 如发现有问题,欢迎留言指出,我及时更正