1、将iconfont中需要的图标，添加到购物车，然后添加到自己的项目。生成在线代码。



2、点击下载至本地。然后解压后复制 iconfont.css 文件到你的项目。

3、复制第一步生成的代码，替换iconfont.css中的@font-face，然后再在//.at前边添加https:

4、再App.vue中引入iconfont.css文件

@import  url('static/iconfont/iconfont.css'); // 路径根据自己而定

5、使用图标

<span class="iconfont icon-xxx"></span>   //xxx代表图标的名字

uniapp如何使用阿里iconfont的更多相关文章

  1. vue 中使用阿里iconfont彩色图标

    在main.js中 import './assets/images/iconfont/iconfont.css'import './assets/images/iconfont/iconfont.js ...

  2. day 51 阿里iconfont的使用

    阿里iconfont的使用   1. 找到阿里巴巴图标库 2.找到图标 3.搜索你想要的图标 4.将图标添加到购物车 5.点击右上角的购物车按钮,我这里添加了两个. 6.提示你登陆,不需要花钱,找其中 ...

  3. Hexo-使用阿里iconfont图标

    Hexo-使用阿里iconfont图标 因为使用hexo搭建的博客中,大家并不懂都有什么图标,fa fa-xx就懵了,不知道都有什么. 首先,fa fa-xxx中的图标可以在 图标库 中寻找. (上面 ...

  4. uni-app引入阿里iconfont

    前言: 目前正在通过 UNI-APP平台开发移动应用,uni-app平台是去年年出才创建的一个新品台,因此资源相对比较匮乏,在此遇到一个问题,一直使用别人提供的iconfont,但总是不够用,为了解决 ...

  5. uni-app在线引入阿里字体图标库

    第一步 在app.vue中引入阿里字体图标库 第二步 在任意页面使用就可以了 <view class="item" v-for="(value,index) in ...

  6. vue项目中使用阿里iconfont图标

    在上一篇文章中介绍了如何在vue项目中使用vue-awesome,如果你想了解,请移步<vue项目中使用vue-awesome> 这里介绍一下vue项目中如何使用阿里的iconfont图标 ...

  7. uniapp - 如何申请阿里云存储

    长话短说,简略表述 1. 登录阿里云,选择 oos对象云存储 https://oss.console.aliyun.com/overview 2. 新建“Bucket”,名称是唯一的(建议用公司或者个 ...

  8. vue安装openlayers,jquery,bootstrap,阿里iconfont，

    安装 安装openlayers安装指定包安装openlayersVUE中的地图import ol from "openlayers";import "openlayers ...

  9. 阿里iconfont引入方法

    原文:iconfont的引入方法   第一步:使用font-face声明字体@font-face {font-family: 'iconfont';src: url('iconfont.eot'); ...

随机推荐

  1. Noip2011 提高组 Day1 T1 铺地毯 + Day2 T1 计算系数

    Day1 T1 题目描述 为了准备一个独特的颁奖典礼,组织者在会场的一片矩形区域(可看做是平面直角坐标系的第一象限)铺上一些矩形地毯.一共有 n 张地毯,编号从 1 到n .现在将这些地毯按照编号从小 ...

  2. c++ demo code

    /* //多继承 #include <iostream> using namespace std; class Sofa { public: Sofa(); ~Sofa(); void s ...

  3. RabbitMQ 和 Kafka 的消息可靠性对比

    RabbitMQ和Kafka都提供持久的消息保证.两者都提供至少一次和至多一次的保证,另外,Kafka在某些限定情况下可以提供精确的一次(exactly-once)保证. 让我们首先理解一下上述术语的 ...

  4. 在树莓派4b上安装 ROS MELODIC 源码安装

    按照以下步骤照做就可以了,很简单的,就是浪费一点点时间罢了.也可以退而求其次,买个树莓派3B+来玩,哈哈. Step 1: Install Dependecies and Download the P ...

  5. arcpy workspace already in transaction mode

    arcpy workspace already in transaction mode RuntimeError: workspace already in transaction mode 同一个工 ...

  6. Java synchronized和Lock

    Synchronized 1. 将synchronized加在方法上, 即可实现对此方法的同步 public synchronized void deposit(float amt) { float ...

  7. 亿美软通 短信api

    亿美软通 短信api   国际短信http标准协议文档和demo的地址: http://www.b2m.cn/static/doc/ims/ims_sendSingle.html   import d ...

  8. 实时流Streaming大数据：Storm,Spark和Samza

    当前有许多分布式计算系统能够实时处理大数据,这篇文章是对Apache的三个框架进行比较,试图提供一个快速的高屋建瓴地异同性总结. Apache Storm 在Storm中,你设计的实时计算图称为top ...

  9. 自定义msi安装包的执行过程

    有时候我们需要在程序中执行另一个程序的安装,这就需要我们去自定义msi安装包的执行过程. 比如我要做一个安装管理程序,可以根据用户的选择安装不同的子产品.当用户选择了三个产品时,如果分别显示这三个产品 ...

  10. 001-log-log体系-log4j、jul、jcl、slf4j，日志乱象的归纳与统一

    一.概述 log4j→jul→jcl→slf4j之后就开始百花齐放[slf4j适配兼容新老用户] 1.1.log4j阶段 在JDK出现后,到JDK1.4之前,常用的日志框架是apache的log4j. ...