使用uni-app引入阿里巴巴矢量图以及出现小长方形解决方法

简介: 使用uni-app引入阿里巴巴矢量图以及出现小长方形解决方法

首先就是下载阿里巴巴矢量图,不知道怎么用的可以去看一下这篇文章webpack打包font文字目录下的06篇

如果是在pages.json文件下引入图标可以使用第一种(Unicode)引入

引入时需要把前面的&#x给去掉,换成u

f75970cc62134ee8b147f89d73703aad.png

比如:

c7e3de4a4dfd498bb5f61b8ee775e500.png

如果是写在vue里的字体,可以用第二种方式

1768346a95524b44a4766d5d5cb34716.png

样式是在iconfont.css中查找对应样式

直接这样写完是没有效果的,一般效果中会出现小长方形,因为没有引入路径,这时,建议大家引入在线的路径并加上https:即可

打开iconfont.css

96ab034b274a448d94da0787dbe4fefa.png

这里开发的时候最好把路径换成在线路径

aa1503d86b744fdc9bd583b01c7657bb.png

eafcac612f334ff5b7056dd7bb1c54f3.png

40fe7d1f09ef4d359d7b506527aefc27.png

返回iconfont.css加入https:即可

160f327527364011b1caa8d3b2319c52.png

f2481d993b7b41389fdde5b41a881f6b.png

总结:使用第二种方法时需要把iconfont.css中的url路径更改成在线的地址


相关文章
|
3月前
|
开发框架 前端开发 JavaScript
【Azure App Service】.NET应用读取静态文件时遇见了404错误的解决方法
【Azure App Service】.NET应用读取静态文件时遇见了404错误的解决方法
|
3月前
|
应用服务中间件 Linux 网络安全
【Azure 应用服务】PHP应用部署在App Service for Linux环境中,上传文件大于1MB时,遇见了413 Request Entity Too Large 错误的解决方法
【Azure 应用服务】PHP应用部署在App Service for Linux环境中,上传文件大于1MB时,遇见了413 Request Entity Too Large 错误的解决方法
|
5月前
|
应用服务中间件 Linux 网络安全
PHP应用部署在App Service for Linux环境中,上传文件大于1MB时,遇见了413 Request Entity Too Large 错误的解决方法
在Azure App Service for Linux上部署的PHP应用遇到上传文件超过1MB时出现413 Request Entity Too Large错误的解决之法
222 0
|
6月前
|
iOS开发
iOS App Store 上传项目报错 缺少隐私政策网址 (URL) 解决方法
iOS App Store 上传项目报错 缺少隐私政策网址 (URL) 解决方法
iOS App Store 上传项目报错 缺少隐私政策网址 (URL) 解决方法
|
6月前
hbuilderX uni-app 自定义快捷键无效、无法生效解决方法(附:好用的常用的快捷键自定义代码片段)
hbuilderX uni-app 自定义快捷键无效、无法生效解决方法(附:好用的常用的快捷键自定义代码片段)
|
网络安全 开发工具 数据安全/隐私保护
上传成功但是在app管理中心找不到版本提交的解决方法
Appuploader常见错误及解决方法 问题解决秘籍 遇到问题,首先请登录苹果开发者官网检查账号是否有权限,是否被停用,是否过期,是否有协议需要同意,并且在右上角切换账号后检查所有关联的账号是否工作正常,特别留意邮箱地址,当有ipa上传,账号有发生变化,被停用,apple经常发送一些邮件通知,去检查邮件通知并根据邮件通知修改调整。只有账号正常没问题,功能才能正常使用。
|
Android开发 UED
APP启动慢解决方法
APP启动慢解决方法
190 0
导入他人项目时以及run键旁边app出现红叉问题的一个解决方法
在导入他人项目时或者出现下面情况(run键旁边app出现红叉)时候: 笔者自己实践过,只要在本地新建一个或者找一个可以跑通的项目,然后将这个可以跑通的项目的下图中的三个文件复制,覆盖在出问题的项目对应的文件上,即可 ...
793 0
下一篇
无影云桌面