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. SpingMVC入门

    Springmvc简介及配置 1. 什么是springMVC? Spring Web MVC是一种基于Java的实现了MVC设计模式的.请求驱动类型的.轻量级Web框架. 2. SpringMVC处理 ...

  2. P2663 越越的组队

    原题链接  https://www.luogu.org/problem/P2663 很容易看出来是个背包问题嘛: 体积是总分的一半,求最高分,每个同学选或不选,是个 01背包问题. 自信地交上去之后发 ...

  3. skb head/data/tail/end/介绍

    2017年04月26日 18:21:12 abcLinux 阅读数 799   This first diagram illustrates the layoutof the SKB data are ...

  4. c语言 内存，可执行文件

    c语言代码与可执行文件的映射关系 函数中的代码 存储在.text 段中 已初始化的全局变量 存储在.data段 未初始化的全局变量 存储在.bss段中 程序类型 映射到file header中 面试题 ...

  5. redis之持久化RDB与AOF

    redis数据持久化 Redis是一种内存型数据库,一旦服务器进程退出,数据库的数据就会丢失,为了解决这个问题,Redis提供了两种持久化的方案,将内存中的数据保存到磁盘中,避免数据的丢失. RDB持 ...

  6. Ubuntu14.04(indigo)实现RGBDSLAMv2（数据集和实时Kinect）

    Ubuntu14.04(indigo)实现RGBDSLAMv2(数据集和实时Kinect v2) 一.在.bag数据集上跑RGBDSLAMv2 RGBDSLAMv2指的是Felix Endres大神在 ...

  7. Flutter用dio封装http网络请求,设置统一的请求地址、headers及处理返回内容

    封装http请求是项目中经常需要做的,常用于设置通用请求地址.请求headers以及处理返回结果,例如在项目中开发地址.测试地址.上线地址是不一样的,当在封装的请求设置好默认地址之后只需要改一个地址而 ...

  8. LeetCode 搜索旋转排序数组

    假设按照升序排序的数组在预先未知的某个点上进行了旋转. ( 例如,数组 [0,1,2,4,5,6,7] 可能变为 [4,5,6,7,0,1,2] ). 搜索一个给定的目标值,如果数组中存在这个目标值, ...

  9. Maven 引入外部依赖

    pom.xml 的 dependencies 列表列出了我们的项目需要构建的所有外部依赖项. 要添加依赖项,我们一般是先在 src 文件夹下添加 lib 文件夹,然后将你工程需要的 jar 文件复制到 ...

  10. Objective-C中的self与LLVM Clang新引入的instancetype

    我们知道,大部分面向对象语言对于一个类的成员方法都有一个隐含的参数.在C++.Java.C#和JavaScript中是this,而在Objective-C中则是self.当然,由于Objective- ...