前提:我们已经拥有了从阿里图标库下载下来的一系列的字体图标文件
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. springmvc配置文件<context:component-scan>

    在spring.xml配置了这个标签后,spring可以自动去扫描base-pack下面或者子包下面的java文件,如果扫描到有@Component @Controller@Service等这些注解的 ...

  2. Python3 tkinter基础 LabelFrame StringVar 单击按钮,Label中显示的文字更换

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

  3. Python 正则表达式学习

    摘要 在正则表达式中,如果直接给出字符,就是精确匹配. {m,n}? 对于前一个字符重复 m到 n 次,并且取尽可能少的情况 在字符串'aaaaaa'中,a{2,4} 会匹配 4 个 a,但 a{2, ...

  4. CentOS 源码编译安装 Python3

    准备 yum -y install wget gcc make libffi-devel zlib-devel readline-devel bzip2-devel ncurses-devel sql ...

  5. 集训总结DAY.1(18.5.22)——KMP

    DAY 1——5.22 in the morning 依稀记得我们有一场contest. at night chf大佬讲KMP,先膜一波~~~ luoguP3375KMP模板题 KMP算法,又称模式匹 ...

  6. p2596 书架(Treap)

    写平衡树修锅快修到死系列 我太蠢了 其实是平衡树裸体裸题 插入,删除,交换前驱或后继,查询rank和kth 维护一个pos数组,表示第i个书的编号 然后注意许许多多的细节,没了 #include &l ...

  7. ES6中的函数和数组补漏

    对象的函数解构 我们在前后端分离时,后端经常返回来JSON格式的数据,前端的美好愿望是直接把这个JSON格式数据当作参数,传递到函数内部进行处理.ES6就为我们提供了这样的解构赋值. let json ...

  8. propsData 选项 全局扩展的数据传递

    propsData 不是和属性有关,他用在全局扩展时进行传递数据,结合自定义属性获取属性值的props一起使用 html <div id="app"> <regi ...

  9. localhost 和 127.0.0.1 有什么区别?

    另外,主要是好友为什么两个一个有 favicon 一个没有? 127.0.0.1和localhost_180104074532.png

  10. Jquery loading 效果

    function showLoad(tipInfo) { var eTip = document.createElement('div'); eTip.setAttribute('id', 'tipD ...