本身项目是VUE, Element-UI项目, 所以内置Element-UI图标库 地址如下,

使用时:
 

<span class="el-icon-setting"></span>

  

下面是重点引入阿里库

3步就好。

1: 进入阿里图标库网站:  https://www.iconfont.cn/  然后用github账户登录

2:   搜索一个图片加入购物车.

3:点击 购物车, 加入项目之中, 然后下载到本地,

4: 把下载的文件丢入vue项目的 assets -> icon 文件夹里面,

 打开的内容是这样的

5: 在main.js 中引入这个文件

项目中的使用

<span class="iconfont icon-shezhi"></span>

  

VUE 引入阿里图标库的更多相关文章

  1. 在vue项目中引入阿里图标库小记

    使用Vue技术栈开发不仅效率高,而且很友好,而且还有很多基于vue的UI框架,例如:element等,但是这类框架美中不足的是,图标太少.为了解决这个问题,不得不引入第三方字体库,今天以阿里图标库为例 ...

  2. vue 引入阿里图标

    1.去阿里图标矢量图标库将想要的图标添加入库 2.再去库中将图标添加到项目. 3.再到我的项目中,选择,我这里采用的是将图标代码包下载到本地再引入到vue项目中. 4.在vue项目的assets文件夹 ...

  3. VUE引入字体图标库

    1. 下载阿里图标 2. 解压文件,并复制文件到VUE项目内 3. 找到添加的字体图标的.css文件,将.iconfont改成[class^="iconfont"], [class ...

  4. Vue引用阿里图标库

    首先进入官网http://www.iconfont.cn/ 转载:https://blog.csdn.net/qq_34802010/article/details/81451278 选择图标库 在里 ...

  5. flutter 引入第三方 Icon 图标(以阿里图标库为例)

    在fluttter中引入第三方图标库的具体方法: 1.在阿里图标库选好需要用的图标,添加进购物车将选好的图标打包下载到本地(下载代码),复制iconfont.ttf文件到项目中 2.存放途径:lib/ ...

  6. 【vue.js】vue项目使用Iconfont(阿里图标库)

    vue项目使用Iconfont(阿里图标库) 2019-11-12  19:07:02  by冲冲 1.操作步骤 ① 登录阿里巴巴矢量图标库 https://www.iconfont.cn ,注册账号 ...

  7. 关于阿里图标库Iconfont生成图标的三种使用方式(fontclass/unicode/symbol)

    1.附阿里图标库链接:http://www.iconfont.cn/ 2.登录阿里图标库以后,搜索我们需要的图标,将其加入购物车,如图3.将我们需要的图标全部挑选完毕以后,点击购物车图标4.这时候右侧 ...

  8. 阿里图标库iconfont入门使用

    目前大多数的互联网公司,前端开发和UI设计师配合中,针对设计师给图的效果图,前端开发工程师不再像往常一样对于细小图标进行切图,取而代之的是引用阿里图标库(http://iconfont.cn/):简单 ...

  9. 小程序中使用阿里图标库iconfont

    小程序中使用阿里图标库iconfont 项目中常常需要使用到字体图标,微信小程序中使用字体图标与在平常的web前端中类似但是又有区别.下面以使用阿里图标为例子讲解如何在微信小程序中使用字体图标. 第一 ...

随机推荐

  1. ios-时间换算

    经常会遇到时间转换的,在此收藏一个时间换算的方法〜 #pragma mark 时间换算 + (NSString *)setcreateTime:(NSString *)str { //yyyy-MM- ...

  2. hsdf -- 6.21 -- day6

    差点忘写总结…… 这么快就到day6了啊 感觉前面写的总结都是苟屁,跟没有有什么区别…… 今天认真总结一下 最大的失误就是全程肝a题,最后还挂了…… 感觉今天方向偏了,由进行一次测试到仅仅是想要尽可能 ...

  3. javaEE十三种核心技术

    郭晨 软件151 1531610114 java的大方向就是JavaEE,JavaEE不仅仅是socket编程,具体包括13中核心技术. JAVAEE的核心API与组件 JAVAEE平台由一整套服务( ...

  4. c# AutoMapper 使用方式和再封装

    安装方式:使用vs自带的nuget管理工具,搜索AutoMapper ,选择第一个安装到你的项目即可. 我从网上找了一些资料, 参考网址:http://blog.csdn.net/csethcrm/a ...

  5. 如何下载github子目录文件

    比如下载pai子目录下dockerfile文件,可以在浏览器键入 https://raw.githubusercontent.com/Microsoft/pai/master/src/dev-box/ ...

  6. Day 20 常用模块(三)

    一.加密模块 1.加密方式: 1.有解密的加密方式 2.无解密的加密方式,碰撞检查 1.不同数据加密后的结果一定不一致 2.相同数据的加密结果一定是一致 2.hashlib模块 1.基本使用 ciph ...

  7. C# 控件消失等问题

    控件消失原因: 1.新控件的触发导致页面重载,该重载有没有达到原有控件的触发状态进而消失. 2.(目前只发现这一点,后续又发现再更...) 1.示例: ASPX: <div> <!- ...

  8. bzoj5110: [CodePlus2017]Yazid 的新生舞会

    Description Yazid有一个长度为n的序列A,下标从1至n.显然地,这个序列共有n(n+1)/2个子区间.对于任意一个子区间[l,r] ,如果该子区间内的众数在该子区间的出现次数严格大于( ...

  9. Cleanmymac X空间透镜再升级

    什么是空间镜透,在Cleanmymac X中具体干什么使得?你了解多少?没关系,不要紧,看这里,下面给大家分享一下这款好用软件下的实用功能-空间透镜.盘它! 首先,Cleanmymac X是一款Mac ...

  10. android studio Authentication failed for

    今天更新项目代码提示   Authentication failed for  后来一起是把git平台密码修改了 忘了修改android studio 密码所以更新失败 我在android studi ...