1. 打开 http://www.iconfont.cn/

2. 选择我们喜欢的图标，点击上面的小车，加入图标库，即右侧的购物车

3.点击购物车，点击下载代码

4.解压下载的文件夹，将文件夹复制到 assets文件夹中

4.引用iconfont.css

<style>

@import '../assets/icon/iconfont.css';    // 引用 iconfont.css

</style>

5.在用到图标的组件中写：

    <i class="icon iconfont icon-hehuoren"></i>

这样就可以引用到你想要的iconfont图标啦

如何在vue项目中引入阿里巴巴的iconfont图库的更多相关文章

  1. 如何在Vue项目中引入jQuery?

    假设你的项目由vue-cli初始化 (e.g. vue init webpack my-project). 在你的vue项目目录下执行: npm install jquery --save-dev 打 ...

  2. 详解如何在vue项目中引入饿了么elementUI组件

    在开发的过程之中,我们也经常会使用到很多组件库:vue 常用ui组件库:https://blog.csdn.net/qq_36538012/article/details/82146649 今天具体说 ...

  3. 如何在vue项目中引入elementUI组件

    个人博客同步文章 https://mr-houzi.com/2018/02/... 前提:已经安装好Vue 初始化vue vue init webpack itemname 运行初始化demo 运行一 ...

  4. 如何在vue项目中引入element-ui

    安装 elementUI npm install element-ui --save 引入elementUI import ElementUI from 'element-ui' import 'el ...

  5. vue项目中引入Sass

    Sass作为目前成熟,稳定,强大的css扩展语言,让越来越多的前端工程师喜欢上它.下面介绍了如何在vue项目 中引入Sass. 首先在项目文件夹执行命令 npm install vue-cli -g, ...

  6. 如何在Vue项目中给路由跳转加上进度条

    1.前言 在平常浏览网页时,我们会注意到在有的网站中,当点击页面中的链接进行路由跳转时,页面顶部会有一个进度条,用来标示页面跳转的进度(如下图所示).虽然实际用处不大,但是对用户来说,有个进度条会大大 ...

  7. 如何在VUE项目中添加ESLint

    如何在VUE项目中添加ESLint 1. 首先在项目的根目录下 新建 .eslintrc.js文件,其配置规则可以如下:(自己小整理了一份),所有的代码如下: // https://eslint.or ...

  8. 在vue项目中引入jquery

    在vue项目中引入jquerycnpm install jquery --save在main.js中引入,加入下面这行代码:import 'jquery'注:有些项目是按需加载的,在main.js里面 ...

  9. 如何在Vue项目中使用Typescript

    0.前言 本快速入门指南将会教你如何在Vue项目中使用TypeScript进行开发.本指南非常灵活,它可以将TypeScript集成到现有的Vue项目中任何一个阶段. 1.初始化项目 首先,创建一个新 ...

随机推荐

  1. 实验十二：SWING界面设计

    实验程序: import java.awt.FlowLayout;import javax.swing.*;import java.awt.Container;public class jianli ...

  2. 「 CODE[VS] P2853 」 方格游戏

    题目大意 给定一张 $n\times n$ 的网格.每个格子上都有一个系数 $a$,先下 $A$ 和 $B$ 两人选择两条 $(1,1)\rightarrow (n,n)$ 路径.要求着两条路径不能相 ...

  3. SQL学习笔记：一些高级语句

    现在以MySQL为模板.学习的方法和别的数据库写法上会有不同,但是思路基本一致. 用到的数据库表的格式: +----+--------------+-------------------------- ...

  4. jquery 选中设置的值

    select设置值为xxx选中:如下所示 $("#questionClass").val("xxx");

  5. 洛谷P1028数的计算

    https://www.luogu.org/problemnew/show/P1028 只用递归会超时,需要用递归型动规,用一个数组保存已经算过的值,避免重复计算. 求数字为n的方案数的最优子结构为: ...

  6. CSS3制作404立体字体

    CSS3制作404立体字体页面效果     鼠标移动上去,背景色变白.       动态效果:     .demo p:first-child span:hover { text-shadow:0px ...

  7. 【Codeforces 1027D】Mouse Hunt

    [链接] 我是链接,点我呀:) [题意] 题意 [题解] 先求出来强连通分量. 每个联通分量里面,显然在联通块的尽头(没有出度)放一个捕鼠夹就ok了 [代码] #include <bits/st ...

  8. [POJ3162]Walking Race（DP + 单调队列）

    传送门 题意:一棵n个节点的树.wc爱跑步,跑n天,第i天从第i个节点开始跑步,每次跑到距第i个节点最远的那个节点(产生了n个距离),现在要在这n个距离里取连续的若干天,使得这些天里最大距离和最小距离 ...

  9. poj 3925 枚举+prime

    /* 因为15很小可以暴力枚举然后用最小生成树的prim来计算 */ #include<stdio.h> #include<string.h> #include<math ...

  10. 食物链 2001年NOI全国竞赛

    时间限制: 3 s 空间限制: 64000 KB 题目等级 : 钻石 Diamond   题目描述 Description 动物王国中有三类动物 A,B,C,这三类动物的食物链构成了有趣的环形.A吃B ...