我的项目引入的是阿里巴巴的图标库。将下载的阿里巴巴图标库中的 iconfont.css 文件,复制到项目的 commoncss 文件夹下面,如下所示,可以修改一下文件名:

然后修改该文件夹中的内容,由于文件中引用到的其它文件在项目中都不存在,可直接删除掉,只留下 “data” 开头的路径, 如下图红线部分:

注意:路径最后只剩下一个,这行代码的结尾一定是 “ ; ” (封号,载过坑)

以上 css 文件配置完毕,该文件需要在 App.vue 文件中引入,如下所示 :

引入结束,就可以在其它文件中使用啦,如下图:

其中 class 中的属性引用,可以参考下载下来的图标文件中的 demo_index.html 文件,查看源代码得知该图标引用的什么样式,写上即可。

uni-app 小程序引入字体图标相关推荐

  1. 微信小程序引入字体图标

    小程序与平常web开发中引入字体图标的方式不一样,必须先转为base64再引入,以阿里巴巴字体图标 http://iconfont.cn 为例: 一.去官网 http://iconfont.cn 下载 ...

  2. 微信小程序引入阿里巴巴图标库(不下载)

    微信小程序引入阿里巴巴图标库(不下载)@TOC 阿里图标地址:https://www.iconfont.cn 第一步:选择资源管理-我的项目-选择Font class-查看在线链接-点击下方css链接 ...

  3. 微信小程序引入阿里巴巴图标库

    微信小程序引入阿里巴巴图标库 在阿里巴巴图标库下载需要的图标,得到iconfont.wxss文件. 将iconfont.wxss文件放在style目录下. 在app.wxss引入,页面里面添加代码 @ ...

  4. uni-app小程序 阿里巴巴字体图标兼容ios

    问题描述 提示:uni-app 小程序 阿里巴巴字体图标库不兼容 <icon class="iconfont icon-xuanze"></icon> 解决 ...

  5. 小程序引入字体注意点

    小程序引入字体有2种方式, 第一种是通过 @font-face ,第二种是通过小程序提供的方法 loadFontFace. 引入的方式不同但是需要注意的地方大致形同: 官方提出了以下的注意事项 字体文 ...

  6. uniapp微信小程序引入字体

    案例演示 小程序有些字体不支持,我们如何引入,步骤如下: 第一步:下载需要的字体 第二步:如果只是用其中的数字,则需要使用工具单独再摘出来,这样文件会很小. 生成新的字体文件,此文件大小很小. 第三步 ...

  7. 基于uni-app的微信小程序引入字体文件

    上传字体文件至服务器或者oss(也可以引入第三方,需支持nginx跨域) 引入字体文件(两种方法) css引入 @font-face {font-family: 'fontFamily';src: u ...

  8. 微信小程序iconfont字体图标文件无法上传问题

    最近在写毕业设计的时候,因为微信小程序本身的字体图标无法满足我的开发需求,但是在引入之后发现开发工具预览没问题但是真机调试就出现了问题, 在查阅资料后找到了解决的办法.我将原本放在static下的字体 ...

  9. 微信小程序引入iconfont图标,解决渲染层失败(2022年7月11日)

    前言 网上的教程几乎都是清一色的引用阿里云矢量图标的在线链接,可惜现在阿里现在已经没有在线链接了. 解决方法 然后我吧文件下载到本地尝试引用,抱歉woff文件识别不了,微信小程序是没法直接识别woff ...

  10. 小程序引入字体集方式

    一般情况下为了页面好看,有些会设计会采用一些特殊的字体进行设计,这时候直接设置font-family:"该字体类型"; 就会出现没有效果,因为css里面没有这些字体,这时就要我们自 ...

最新文章

  1. silverlight中的socket编程注意事项
  2. 利用Python绘制中国新型冠状病毒疫情图(国家和省)
  3. Spark(idea)操作mysql进行查询和插入 (代码+理解)
  4. 我学到的5件事,指导2,500名有抱负的开发人员
  5. 如何判断一个大佬值不值得跟随
  6. 从 JMM 透析 volatile 与 synchronized 原理
  7. 算法:冒泡排序(Bubble Sort)、插入排序(Insertion Sort)和选择排序(Selection Sort)总结...
  8. 基于OpenCV的 桌面手机的尺寸测量
  9. Unity Rect.OverLaps(Rect other) 改进
  10. 比较出名的几种美国主机
  11. 墙面有几种装修方法_外墙有几种装修方法
  12. 六种常用的文本聚类算法介绍
  13. 论文学习笔记:CSRNet: Dilated Convolutional Neural Networks for Understanding the Highly Congested Scenes
  14. CSP:给大家介绍下我爸爸 — Performance
  15. matlab的magic函数,python实现类似于Matlab中的magic函数
  16. 非华为手机Scrcpy无线投屏电脑多屏协同步骤(电脑无线连接投屏手机,设备,tcpip)
  17. 答 ricky52529 关于EF线程、事件、编译器、IDE……
  18. 腾讯云Android 人脸识别,快速接入代码
  19. Problem M: 车牌限行
  20. iptables转发mysql_CentOS系统中使用iptables设置端口转发

热门文章

  1. 软件测试中的80/20原则
  2. React-native实现联系人列表分组组件(支持拼音搜索)
  3. PROFINET协议
  4. 主成分分析(PCA)原理、步骤
  5. 计算机注销操作,电脑注销快捷键
  6. 怎样在视频上加字幕,分享视频添加字幕的小技巧
  7. 1.北京理工大学Python与机器学习-绪论
  8. html文本框虚线并加上文字,文字边框虚线样式用css怎么写?(示例)
  9. Java8日期时间API
  10. 嵌入式-stm32学习:使用固件库点亮LED