前提:我们已经拥有了从阿里图标库下载下来的一系列的字体图标文件
1：找个其中的ttf格式的文件,然后打开https://transfonter.org/网站
2：点击Add fonts按钮,加载ttf格式的那个文件
3:选择下边的base64 encode改oof为on
4:点击Convert按钮 进行转换
5：转换后点击download下载
6:下载下来后 找到stylesheet.css文件 添加类
.iconfont {

font-family: 'iconfont';

font-weight: 500;

font-style: normal;

}
7:找到我们之前阿里图标文件里面的iconfont.css文件将所有的:before拷贝到stylesheet.css文件中 然后我们就可以使用字体图标了 iconfont icon-mg-hotel

微信小程序如何导入字体图标的更多相关文章

  1. 如何在微信小程序中使用字体图标

    微信小程序中,在image标签里,可以在src中引用本地文件,但是background设置背景图或者使用字体图标的时候,却不能引用本地文件,只能用url地址的图片或字体,或者使用base64编码后的格 ...

  2. 微信小程序如何引用iconfont图标

    最近在研究微信小程序,自己写demo的时候想要引用巴里巴巴图标库的图标,于是: @font-face { font-family: 'iconfont'; src: url('iconfont.eot ...

  3. 微信小程序引用阿里巴巴矢量图标iconfont

    最近在写微信小程序,但是引用图片,导致项目文件太大,所以就想到引用阿里巴巴矢量图标的方法 第一步:下载阿里巴巴矢量图代码: 第二步:将下载下来的文件中iconfont.ttf转换即可.转换地址:htt ...

  4. 微信小程序Canvas添加水印字体，通过setGlobalAlpha设置字体透明度。

    微信小程序自带的设置透明度只有setGlobalAlpha,但是CanvasContext.setGlobalAlpha设置透明度,是全局透明,整张图片都透明了.所以直接使用是不行的. 换种思路实现: ...

  5. 微信小程序设置全局字体

    微信小程序设置全局css,需要在app.wxss文件中设置page的样式 page { font-family:"PingFangSC-Thin"; font-size:32rpx ...

  6. 微信小程序 - tabbar动态更换图标以及文字

    大家不喜欢小程序的tabbar原因之一就是它太死板,tabbar一旦在app.json定义以后文字不能改,图标不能改! 我要自制tabbar!!! 其实在微信更新完1.9.0基础调试以后就推出了更新方 ...

  7. 在微信小程序中使用阿里图标库Iconfont

    首先想要使用图标,只用上图的五个iconfont相关文件就可以了.(下下来的文件iconfont.wxss开始是.css的后缀,手动改成.wxss就可以在小程序中使用) 然后在app.wxss中引入i ...

  8. uni/微信小程序 - 使用外部字体

    字体图标/字体仅支持网络css路径(也就是不支持本地路径) 参考于:https://blog.csdn.net/u013451157/article/details/79825740

  9. 微信小程序开发 导入文件说没找到.json的问题

    这个真的坑爹 网上的答案也没几个靠谱 说白了就是找个空文件直接创建 然后复制粘贴 反应了这玩意ide不成熟 进去之后直接创了个quick start的源码 也就是我们看的这个网页建议我们下载的源码 老 ...

随机推荐

  1. 又是DataSnap的问题

    最近在调试DataSnap的程序,突然发现TClientDataSet打不开了,报错为dsnap200.bpl的非法地址访问,如下图: 很是怪异,干脆新建工程,只有TSQLConnection.TSQ ...

  2. Python3基础 iter+next 进行迭代时超出了范围 产生StopIteration异常

             Python : 3.7.0          OS : Ubuntu 18.04.1 LTS         IDE : PyCharm 2018.2.4       Conda ...

  3. CentOS 安装 Redis 笔记

    Redis 安装 yum install redis -y 在启动 redis-server 之前,你需要修改配置文件/etc/redis.conf: 找到 bind 127.0.0.1,将其注释,这 ...

  4. linux下关于mysql的命令的用法

    所有关于mysql的命令都在/usr/bin/中, 使用 /usr/bin | grep 'mysql'可以列出这些mysql命令 导出数据库, 可以直接在 命令行中, 使用 mysqldump -u ...

  5. Jenkins serving Cake: our recipe for Windows

    https://novemberfive.co/blog/windows-jenkins-cake-tutorial/ Where we started, or: why Cake took the ...

  6. Module controller in JMeter

    https://qualibrate.com/blog/quality-assurance/jmeter-module-controller/ 通过组合Test Fragments 和Module C ...

  7. 论文笔记之：Graph Attention Networks

    Graph Attention Networks 2018-02-06  16:52:49 Abstract: 本文提出一种新颖的 graph attention networks (GATs), 可 ...

  8. 多线程tips（面试常用）

    描述线程和进程的区别? 我们运行一个exe,就是一个进程实例,系统中有很多个进程.每一个进程都有自己的内存地址空间,每个地址相当于一个独立的边界,有自己独占的资源,进程之间不能共享代码和数据空间.(可 ...

  9. FPGA 概述2

    参考1 参考2:浅论各种调试接口(SWD.JTAG.Jlink.Ulink.STlink)的区别 以下数据仅供参考 文章概要 主流FPGA厂商及产品 相同设计在FPGA与ASIC中耗费器件数量比较 F ...

  10. ie 支持字体大小继承

    今天需要实现字体大小继承这个效果.是这样的,在公用类里 .box 中的 .box1 的字体进行了修改.但是我的页面里不需要修改.我需要让他和 .box 一样.所以想到使用继承.但是想到继承这个属性兼容 ...