一、先到阿里巴巴矢量图标库(http://iconfont.cn/)，用微博帐号登录，搜索你想要的图标，然后添加入库

从项目里下载下来并解压，找到ttf格式文件

二、到这个平台https://transfonter.org/，把刚才下载的ttf字体文件转化成base64格式 原文:http://www.soswen.com/article/10

三、下载下来之后解压找到stylesheet.css ,打开文件，复制这些内容到wxss里：

四、打开之前在阿里巴巴下载的压缩包，找到iconfont.css文件，打开它全部复制到wxss里

四、在wxml加入字体就可以使用了

微信小程序使用字体图标的方法的更多相关文章

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

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

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

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

  3. 微信小程序 - 提取字体图标与其优化

    微信小程序,无论是字体图标还是图标,都差不多,只不过是为了以后字体图标修改方便,或者加效果方便而使用它而已! 1. 下载font-awesome http://fontawesome.dashgame ...

  4. 微信小程序 - 使用字体图标（阿里云库）

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

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

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

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

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

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

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

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

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

  9. 微信小程序 传值取值的方法总结

    微信小程序 传值取值的几种方法总结 列表index下标取值 页面传值 form表单取值 1. 列表index下标取值 实现方式是:data-index="{{index}}"挖坑及 ...

随机推荐

  1. xamarin android打开拍照

    xamarin android打开摄像头 Intent intentBrowser = new Intent("android.media.action.IMAGE_CAPTURE" ...

  2. c#程序连接mysql，报"Illegal mix of collations (utf8_general_ci,IMPLICIT) and (utf8_unicode_ci,IMPLICIT) for operation '='"的解决方案

    =============================================== 20170607_第一次修改                       ccb_warlock === ...

  3. tar: This does not look like a tar archive tar: Skipping to next header tar: Exiting with failure status due to previous errors

    解压一个.tar.zip文件时报错 tar -zxvf bcl2fastq2-v2---linux-x86-.zip tar: This does not look like a tar archiv ...

  4. 房上的猫：HTML5基础

    一.W3C标准 1)W3C标准不是某一个标准,而是一系列的标准的集合,一个网页主要由三部分组成,即结构(Structure),表现(Presentation)和行为(Behavior) 2)不很严谨的 ...

  5. windows安装ipython的困难重重

    本机环境 系统: windows 10 64位 python版本:3.2.1 安装过程 安装ipython可以使用python的pip工具 pip install ipython 在使用pip前,我准 ...

  6. 固定底部导航菜单-续集（BottomMenu-移动端V3.0）

    固定底部导航菜单-续集(BottomMenu-移动端V3.0) 适应在客户端,点击弹出二级菜单.因为手机不支持hover.所以使用click点击实现弹出菜单,并且一级菜单聚焦变色,变化背景图片 核心c ...

  7. c/c++ 贪吃蛇控制台版

    贪吃蛇控制台版(操作系统win7 64位:编译环境gcc, vs2017通过,其它环境未测试 不保证一定通过) 运行效果: #include <iomanip> #include < ...

  8. Oracle 触发器的使用

    一.触发器的作用 触发器的作用类似拦截器.把一些针对数据库的DML操作(insert/update/delete/select)进行拦截,符合业务要求的进行操作,不符合要求的操作可以通过抛出异常来阻止 ...

  9. rtx web 分级管理系统 二次开发

    fineui + ASP.NET+rtx server sdk 修正 rtx管理器 修改用户后分级目录出错问题. 加入 单用户多个部门 添加授权关闭部分采用 rsa加密.

  10. CSS属性：背景属性（图文详解）

    本文最初发表于博客园,并在GitHub上持续更新前端的系列文章.欢迎在GitHub上关注我,一起入门和进阶前端. 以下是正文. background系列属性 常见背景属性 CSS样式中,常见的背景属性 ...