小程序中使用、H5、uniapp下使用阿里巴巴iconfront图标或者新增图标
第一步:登录iconfont的账号,创建项目。

第二步:选择自己需要的图标,并添加入库(就是那个购物车的图标)。

第三步:将选好的图片添加到项目。(点击上图中右上角的购物车图标)。

第四步:下载资源到本地,并解压。

第五步:将iconfont.css和iconfont.ttf 复制到自己的工程中(我这里是放在static下)。
第六步:修改iconfont.css中的@font-face 下的ttf的 src(src 使用的是绝对路径,我这里只保留了ttf)。

第七步:在使用的文件中使用import 引入,通过类名选择图标。

如果是添加新的图标,重新走第二三四步。第五步只需要替换。.ttf文件
以此篇博客结束即将过去的2021 。希望新的一年越来越好!
小程序中使用、H5、uniapp下使用阿里巴巴iconfront图标或者新增图标的更多相关文章
- 一招解决微信小程序中的H5缓存问题
一招解决微信小程序中的H5缓存问题1.问题描述开发过程中,为了更新代码方便,往往会在小程序中嵌入H5页面.但问题来了,小程序原生代码更新版本后,简单的从微信中删除或者代码强刷就可以解决缓存问题,但小程 ...
- 微信小程序中如何实现分页下拉加载?(附源码)
转眼间坚持写教你微信小程序系列已经有十节系列课程了,每天的工作压力繁重,小女子也不知道自己还能坚持这样的系列教程多久.只希望每篇教程真的对大家有帮助.这节课我们要介绍的就是如何实现分页的下拉加载,我们 ...
- 在微信小程序中,如何实现下拉刷新(模拟刷新)
一.在app.json中启动刷新, 在Windows 中, 添加 "enablePullDownRefresh":"true" 二.在需要刷新的页面中写(若是 ...
- 小程序中嵌套的h5页面设置分享转发
场景描述:当在小程序中打开h5页面时,希望小程序的转发出去的标题,图片,跳转link可以通过h5通信实现自定义. 实现方式:通过h5给小程序通信,发送标题,图片,跳转link等信息,让小程序设置分享. ...
- 在小程序中引入有赞的vant框架组件
这里给大家讲解小程序中如何引入vant组件(我这里是采用小程序的云开发模板) 1.首先在项目的miniprogram文件夹右键在终端中打开,输入命令npm init初始化生成一个package.jso ...
- uni-app - 支付(app支付、小程序支付、h5(微信端)支付)
App支付.小程序支付.h5(微信端)支付 APP支付(内置) appPay.js /** * 5+App支付,仅支持支付宝以及微信支付 * * 支付宝Sdk集成,微信sdk未集成 * * @para ...
- 微信小程序和微信H5测试中易出Bug的点和注意事项
一.微信小程序 易出Bug的点: 小程序的分享转发功能 背景:小程序项目开发基本完毕也都已经测过几轮,功能上基本没有什么问题,但是上线后却被客户发现通过分享转发小程序给别人,别人无法正常打开的情况 原 ...
- 微信小程序中使用 <web-view> 内嵌 H5 时,登录问题的处理方法
在微信小程序的开发中,经常遇到需要使用 <web-view></web-view> 内嵌 H5 的需求.在这种需求中比较棘手的问题应该就是登录状态的判断了,小程序中的登录状态怎 ...
- 全栈开发工程师微信小程序-中(下)
全栈开发工程师微信小程序-中(下) 微信小程序视图层 wxml用于描述页面的结构,wxss用于描述页面的样式,组件用于视图的基本组成单元. // 绑定数据 index.wxml <view> ...
随机推荐
- nodeJs-Stream接口
JavaScript 标准参考教程(alpha) 草稿二:Node.js Stream接口 GitHub TOP Stream接口 来自<JavaScript 标准参考教程(alpha)> ...
- Angular @Input讲解及用法
1.什么是@input @input的作用是定义模块输入,是用来让父级组件向子组件传递内容. 2.@input用法 首先在子组件中将需要传递给父组件的变量用@input()修饰 需要在子组件ts文件i ...
- windows Visual Studio 上安装 CUDA【转载】
原文 : http://blog.csdn.net/augusdi/article/details/12527497 前提安装: Visual Studio 2012 Visual Assist X ...
- 求最长子序列(非连续)的STL方法 - 洛谷P1020 [NOIP1999 普及组] 导弹拦截
先给出例题:P1020 [NOIP1999 普及组] 导弹拦截 - 洛谷 | 计算机科学教育新生态 (luogu.com.cn) 大佬题解:P1020 [NOIP1999 普及组] 导弹拦截 - 洛谷 ...
- Hibernate持久化标志符生成策略
generator子元素定义持久化标识符的生成策略,为持久化类对应的数据库表的主键找到了赋值方法,HIbernate默认将使用assigned的持久化标识符生成策略.关系型数据库的主键定义方式:(1) ...
- 通信协议 HTTP TCP UDP
TCP HTTP UDP: 都是通信协议,也就是通信时所遵守的规则,只有双方按照这个规则"说话",对方才能理解或为之服务. TCP HTTP UDP三者的关系: T ...
- Docker 安装 Oracle12c
为选定需要pull到系统中的数据库镜像 # docker pull sath89/oracle-12c --------sath89/oracle-12c为选定需要pull到系统中的数据库镜像 doc ...
- canal安装与使用
安装 alpha的版本不是稳定的版本 wget https://github.com/alibaba/canal/releases/download/canal-1.1.4/canal.deploye ...
- 01_ubantu国内软件源配置
查找自己版本对应的软件源 https://mirrors.tuna.tsinghua.edu.cn/help/ubuntu/ 以下为19.10版本清华大学的,个人100M的带宽,平均安装速度在600K ...
- 关于python中的随机种子——random_state
random_state是一个随机种子,是在任意带有随机性的类或函数里作为参数来控制随机模式.当random_state取某一个值时,也就确定了一种规则. random_state可以用于很多函数,我 ...