第一步:

在iconfont库中,找到你想要的图标,加入到购物车,再在购物车中将图标加入到你的项目中去

  

第二步:

在项目中,可以看到刚刚加入的图标,这里是你在项目中所有用到的iconfont,选择下载至本地

第三步:

将下载的压缩包解压,将其中的css、eot、svg、ttf、woff文件放入到你的项目中(若项目之前有这些文件,则直接替换即可,因为下载的文件中包含了你项目中所有的图标),此时可以看到,css、svg中加入了你想要的图标

第四步:

以上三步就已经将你想要的iconfont加到项目中了,只要使用时,通过 i.iconfont.icon-guanlianshebei 引用即可

前端小白技术摸索中,若有误,望指正!

关于阿里 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. vue项目中使用阿里iconfont图标

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

  5. vue安装openlayers,jquery,bootstrap,阿里iconfont,

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

  6. 阿里iconfont引入方法

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

  7. uni-app引入阿里iconfont

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

  8. 阿里iconfont的使用

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

  9. uniapp如何使用阿里iconfont

    1.将iconfont中需要的图标,添加到购物车,然后添加到自己的项目.生成在线代码. 2.点击下载至本地.然后解压后复制 iconfont.css 文件到你的项目. 3.复制第一步生成的代码,替换i ...

随机推荐

  1. Hadoop运行原理总结(详细)

    本编随笔是小编个人参照个人的笔记.官方文档以及网上的资料等后对HDFS的概念以及运行原理进行系统性地归纳,说起来真的惭愧呀,自学了很长一段时间也没有对Hadoop知识点进行归纳,有时候在实战中或者与别 ...

  2. hadoop作业

    作业要求:https://edu.cnblogs.com/campus/gzcc/GZCC-16SE1/homework/3223 一.准备一个ubantu 系统 二.创建hadoop用户 创建 设密 ...

  3. 【Alpha】“北航社团帮”小程序v1.0项目展示

    目录 1.团队介绍 2.回答一些工程问题 整个项目的目标和预期功能 整个项目的预期典型用户 整个项目的预期用户数量 alpha满足的用户需求 alpha用户量一览 团队分工及经验教训 团队项目管理 时 ...

  4. Devops(四):Docker 镜像管理

    参考 <Docker中上传镜像到docker hub中> <Docker 镜像管理> <通过容器提交镜像(docker commit)以及推送镜像(docker push ...

  5. tmp 字典合并

    tmp  

  6. Linux配置crontab

    1. 添加任务(每分钟执行一次)crontab -e* * * * * /home/lings/logRotate.sh 2. 查看日志Jun 5 20:25:01 localhost CROND[8 ...

  7. linux进程守护脚本

    为了防止进程异常挂掉,为了避免影响业务,编写一个守护进程,定时检查某个进程是否存在,如果不存在则自动启动该进程.编写脚本文件daemon.sh文件 while true; do server=`ps ...

  8. git 比较实用的命令

    git 删除已经add 过的文件 使用 git rm 命令即可,有两种选择, 使用 git rm 命令即可,有两种选择, 一种是 git rm --cached "文件路径",不删 ...

  9. python的super深入了解(转)

    1.python的继承以及调用父类成员 python子类调用父类成员有2种方法,分别是普通方法和super方法 假设Base是基类 class Base(object): def __init__(s ...

  10. dotfuscator 在混淆.Net Framework 4.0以上版本的时候报错的解决方法2

    在混淆的时候报错了,错误描述大致如下: Could not find a compatible version of ildasm to run on assembly C:\xxx.dll This ...