关于阿里 iconfont 的使用步骤
第一步:
在iconfont库中,找到你想要的图标,加入到购物车,再在购物车中将图标加入到你的项目中去

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

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



第四步:
以上三步就已经将你想要的iconfont加到项目中了,只要使用时,通过 i.iconfont.icon-guanlianshebei 引用即可
前端小白技术摸索中,若有误,望指正!
关于阿里 iconfont 的使用步骤的更多相关文章
- vue 中使用阿里iconfont彩色图标
在main.js中 import './assets/images/iconfont/iconfont.css'import './assets/images/iconfont/iconfont.js ...
- day 51 阿里iconfont的使用
阿里iconfont的使用 1. 找到阿里巴巴图标库 2.找到图标 3.搜索你想要的图标 4.将图标添加到购物车 5.点击右上角的购物车按钮,我这里添加了两个. 6.提示你登陆,不需要花钱,找其中 ...
- Hexo-使用阿里iconfont图标
Hexo-使用阿里iconfont图标 因为使用hexo搭建的博客中,大家并不懂都有什么图标,fa fa-xx就懵了,不知道都有什么. 首先,fa fa-xxx中的图标可以在 图标库 中寻找. (上面 ...
- vue项目中使用阿里iconfont图标
在上一篇文章中介绍了如何在vue项目中使用vue-awesome,如果你想了解,请移步<vue项目中使用vue-awesome> 这里介绍一下vue项目中如何使用阿里的iconfont图标 ...
- vue安装openlayers,jquery,bootstrap,阿里iconfont,
安装 安装openlayers安装指定包安装openlayersVUE中的地图import ol from "openlayers";import "openlayers ...
- 阿里iconfont引入方法
原文:iconfont的引入方法 第一步:使用font-face声明字体@font-face {font-family: 'iconfont';src: url('iconfont.eot'); ...
- uni-app引入阿里iconfont
前言: 目前正在通过 UNI-APP平台开发移动应用,uni-app平台是去年年出才创建的一个新品台,因此资源相对比较匮乏,在此遇到一个问题,一直使用别人提供的iconfont,但总是不够用,为了解决 ...
- 阿里iconfont的使用
1.找到阿里巴巴图标库 2.找到图标 3.搜索你想要的图标 4.将图标添加到购物车 5.点击右上角的购物车按钮,我这里添加了两个. 6.提示你登陆,不需要花钱,找其中一个账号登陆一下就行了 假如你使用 ...
- uniapp如何使用阿里iconfont
1.将iconfont中需要的图标,添加到购物车,然后添加到自己的项目.生成在线代码. 2.点击下载至本地.然后解压后复制 iconfont.css 文件到你的项目. 3.复制第一步生成的代码,替换i ...
随机推荐
- 动态BGP与静态BGP
在阿里云上选择ECS的时候,发现有动态BGP和静态BGP区分,静态的要便宜些,搜了下区别如下: 静态BGP路由是指由网络运营商手动配置的路由信息.当网络的拓扑结构或链路的状态发生变化时,运营商需要手动 ...
- odoo开发笔记--form视图按钮样例
如图: 对应后台views视图,class可选内容值: class="oe_highlight" class="btn-xs" class="btn- ...
- kafka集群部署以及单机部署
kafka单机部署 一.环境准备 当前环境:centos7.3一台软件版本:kafka_2.12部署目录:/usr/local/kafka启动端口:9092配置文件:/usr/local/kafk ...
- WebGL学习笔记(四):绘图
图元 WebGL可以绘制非常复杂的3D模型,这些模型都是由下面3种基本几何图元构成的,下面我们来详细的看看. 三角形 WebGL中任何复杂的模型,都是由三角形组合而成的,可以说三角形是任意形状的最小构 ...
- 基于EasyNVR摄像机无插件直播方案二次开发实现自己的摄像机IPC-NVR无插件化直播解决方案
背景介绍 在之前的博客中<基于EasyNVR实现RTSP/Onvif监控摄像头Web无插件化直播监控>,对EasyNVR所实现的功能我们已经有较多描述,这些也在方案地址:http://ww ...
- [LeetCode] 381. Insert Delete GetRandom O(1) - Duplicates allowed 插入删除和获得随机数O(1)时间 - 允许重复
Design a data structure that supports all following operations in average O(1) time. Note: Duplicate ...
- 警方破获超大DDoS黑产案,20万个僵尸网络运营商被抓
中国警方已镇压并逮捕了一个犯罪集团,该集团经营着一个由200,000多个受感染网站构成的僵尸网络,这些网站被用来发起DDoS攻击. 这是中国当局针对兴旺的本地DDoS租用场景进行的首次重大镇压,最大的 ...
- tablespace表空间
tablespace——表空间,便于理解,把oracle数据库看作一个实在房间,表空间可以看作这个房间的空间,是可以自由分配,在这空间里面可以堆放多个箱子(箱子可以看作数据库文件),箱子里面再装物件( ...
- MySQL执行计划值type,强烈推荐
表结构: create table user ( id int primary key, name varchar(), sex varchar(), index(name) )engine=inno ...
- python的安装与配置
pyhton的下载与安装 1.python官网地址:https://www.python.org 2.下载 Python 编辑器PyCharm PyCharm 是一款功能强大的 Python 编辑器 ...