微信小程序,无论是字体图标还是图标,都差不多,只不过是为了以后字体图标修改方便,或者加效果方便而使用它而已!

1. 下载font-awesome

http://fontawesome.dashgame.com/assets/font-awesome-4.7.0.zip

2.解压后,找到fontawesome-webfont.ttf

3.然后进入以下网站进行格式转换

https://transfonter.org/

4.下载到本地

5.把css文件提出来

6.新建一个wxss文件,然后把 font-awesome.css里面的内容复制一遍(除了标红线以外)

复制到wxss文件中。

7.然后再将里面的内容复制到wxss文件中(最好就是将stylesheet.css改成.wxss文件后缀,最后就是把font-awesome.css复制一遍到其尾部即可)

8.OK了,现在可以直接用了

9.不过你觉不觉得这字体图标太大了,我的天(我才用两个字体图标,还不如用图片呢)

10. 字体图标与font-awesome同步(可单独选择自己需要的字体图标)

http://fontello.com/

微信小程序 - 提取字体图标与其优化的更多相关文章

  1. 微信小程序使用字体图标

    项目中常常需要使用到字体图标,微信小程序中使用字体图标与在平常的web前端中类似但是又有区别.下面以使用阿里图标为例子讲解如何在微信小程序中使用字体图标. 第一步:下载需要的字体图标 进入阿里图标官网 ...

  2. 微信小程序 使用字体图标 iconfont

    第一步:在阿里巴巴矢量图标库下载需要的图标 地址:https://www.iconfont.cn/ 添加至项目 第二步:打开在线代码 将在线代码复制 第三步:点击下载至本地下载图标 将下载的downl ...

  3. 微信小程序 - 使用字体图标(阿里云库)

    实现 阿里图库:https://www.iconfont.cn/ CSS3:[attribute*=value] 选择器 步骤 1. 加入购物车 2. 下载代码解压,复制iconfont.css ap ...

  4. uni/微信小程序 - 使用字体图标

    阿里字体图标:http://www.iconfont.cn/home/index?spm=a313x.7781069.1998910419.2 1.单个/ 多个选择字体图标 2. 导入字体库 可以参考 ...

  5. 微信小程序使用字体图标的方法

    一.先到阿里巴巴矢量图标库(http://iconfont.cn/),用微博帐号登录,搜索你想要的图标,然后添加入库 从项目里下载下来并解压,找到ttf格式文件 二.到这个平台https://tran ...

  6. 微信小程序自定义字体及自定义图标问题说明

    自定义图标及自定义字体,一直是很多小程序开发者的心病,其实本站是很多解决方案的,为了集中起来,方便直接跳过此坑,我特别做了这次针对字体及字体图标的跳坑: 相关文章:微信小程序添加并使用外部字体(成功添 ...

  7. 微信小程序使用阿里图标

    微信小程序不支持外联阿里图标,必须下载放入小程序的本地文件中. 步骤一:下载项目图标 步骤二:转换iconfont.ttf文件(小程序的wxss文件的font-face的url不接受http地址作为参 ...

  8. 微信小程序内容组件图标 icon

    小程序内置了一下图标可以用 需要自定义图标的看这里 ==>微信小程序中使用iconfont/font-awesome等自定义字体图标 小程序内置图标使用示例 <icon type=&quo ...

  9. 微信小程序 canvas 字体自动换行(支持换行符)

    微信小程序 canvas 自动适配 自动换行,保存图片分享到朋友圈  https://github.com/richard1015/News 微信IDE演示代码https://developers.w ...

随机推荐

  1. python+ selenium 实现简历自动刷新

    本文用到的文件的下载地址 百度网盘链接: https://pan.baidu.com/s/1wIda-wUz4X_Ck72xgZ6Ddg 提取码: etaa 1 安装Python 和 selenium ...

  2. python计算机基础(一)

    什么是编程语言? 跟计算机交流的语言 什么是编程? 编程就是写代码,让计算机能够听懂的语言 为什么要编程? 让计算机为我们做事,取代人 计算机5大组成分别有什么作用? CPU:控制,判断,配作用,内存 ...

  3. LeetCode(90) Subsets II

    题目 Given a collection of integers that might contain duplicates, nums, return all possible subsets. ...

  4. ACM训练联盟周赛 K. Teemo's reunited

    Teemo likes to drink raspberry juice.  He even spent some of his spare time tomake the raspberry jui ...

  5. PAT Basic 1031

    1031 查验身份证(15)(15 分) 一个合法的身份证号码由17位地区.日期编号和顺序编号加1位校验码组成.校验码的计算规则如下: 首先对前17位数字加权求和,权重分配为:{7,9,10,5,8, ...

  6. win7定时关机

    菜单>附件>系统工具>任务计划程序>创建基本任务 alt+r>cmd>shutdown/? 查看相关参数 /l 注销 /s 关机 /r 重启 /g 重启,重启后,重 ...

  7. poj2104&&poj2761 (主席树&&划分树)主席树静态区间第k大模板

    K-th Number Time Limit: 20000MS   Memory Limit: 65536K Total Submissions: 43315   Accepted: 14296 Ca ...

  8. jQuery获得页面元素的绝对/相对位置

    获取页面某一元素的绝对X,Y坐标,可以用offset()方法: var X = $('#DivID').offset().top; var Y = $('#DivID').offset().left; ...

  9. hdu6058[链表维护] 2017多校3

    用一个双向链表来查找比当前元素大的前k-1个元素和后k-1个元素 ,从小到大枚举x,算完x的贡献后将x从链表中删除,优化到O(nk). /*hdu6058[链表维护] 2017多效3*/ #inclu ...

  10. UVA 11297 Census ——二维线段树

    [题目分析] 二维线段树模板题目. 简直就是无比的暴力.时间复杂度为两个log. 标记的更新方式比较奇特,空间复杂度为N^2. 模板题目. [代码] #include <cstdio> # ...