当前位置:网站首页>uniapp使用阿里图标
uniapp使用阿里图标
2022-06-12 18:40:00 【BackgroundHero】
选择自己喜欢的图标点击添加入库
在右上角找到购物图案,点击,将选好的图标添加到项目里

添加后跳转到项目里
点击下载到本地
解压后找到iconfont.css文件,复制到uniapp项目里

在App.vue里导入公共样式(也就是刚刚导入的字体图标样式iconfont.css)

这里有很多种写法
亲测,这三种写法都支持
然后再回到阿里图标
点击复制代码
然后打开iconfont.css
将第一段的内容全部替换成复制的代码
然后就能在页面中使用阿里图标了
此时的图标可以当成字体来设置大小
<text class="iconfont iconfengzheng" style="font-size: 200px;"></text>

效果如图
补充:
还需要在iconfont.css里,将里面的链接前面都加上https:
这也是后来发现的
将项目打包运行在手机上时图标显示不出来
具体原因不知
盲猜可能是由于安卓系统的限制不允许访问非https链接
边栏推荐
- Review of MySQL (VI): usage of Union and limit
- 用一个性能提升了666倍的小案例说明在TiDB中正确使用索引的重要性
- 什么是网络代理
- Redis(三十二)-用Redis做分布式锁
- PHP:Fatal error: Allowed memory size of 262144 bytes exhausted (tried to allocat
- Hugo 博客搭建教程
- 基于halcon—缺陷检测常用方法与示例总结
- CVPR 2022 Oral 大连理工提出SCI:快速、超强的低光照图像增强方法
- 2022.6.12-----leetcode. eight hundred and ninety
- Experiment 10 Bezier curve generation - experiment improvement - interactive generation of B-spline curve
猜你喜欢

VirtualLab basic experiment tutorial -5 Poisson bright spot

leetcode:6097. 替换字符后匹配【set记录 + 相同长度逐一查询】

The difference between user status and system status in CRM

Title 66: input 3 numbers a, B, C, and output them in order of size.

Topic 66: input array, exchange the largest element with the first element, exchange the smallest element with the last element, and output array.

Mysql ->>符号用法 Json相关

Gospel of audio and video developers, rapid integration of AI dubbing capability

【矩阵论 & 图论】期末考试复习思维导图

Review of MySQL (V): Joint table query and sub query

Implementing reflexive ACL in Cisco packet tracker
随机推荐
Review of MySQL (V): Joint table query and sub query
Leetcode 416. 分割等和子集
VirtualLab基础实验教程-4.单缝衍射
Vue —— 进阶 vue-router 路由(二)(replace属性、编程式路由导航、缓存路由组件、路由的专属钩子)
Two months later, my second listing anniversary [June 2, 2022]
What is a network proxy
【sql语句基础】——查(select)(单表查询)
Leetcode 1049. 最后一块石头的重量 II
Leetcode topic [string] - Sword pointing offer 05- replace spaces
在思科模拟器Cisco Packet Tracer实现自反ACL
PHP:Fatal error: Allowed memory size of 262144 bytes exhausted (tried to allocat
How to modify the authorization of sina Weibo for other applications
2022.6.12 - leetcode. 89.
Observe the page of the website
leetcode:6095. 强密码检验器 II【简单模拟 + 不符合直接False】
Order allocation strategy for instant delivery: from modeling and Optimization - Notes
Free measurement of rectangular card [manual drawing ROI] Based on Halcon
Hugo blog building tutorial
VirtualLab基础实验教程-6.闪耀光栅
leetcode:5259. 计算应缴税款总额【简单模拟 + 看看在哪个区间】