阿里矢量图标库的使用

阿里矢量图标库的使用1、注册登录账号网站地址:https://www.iconfont.cn/该网站可通过GitHub或新浪账号进行登录下面是网站的首页2、查找图标在中间输入框输入想要查找的图标,。以‘home

大家好,又见面了,我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。

Jetbrains全系列IDE使用 1年只要46元 售后保障 童叟无欺

1、注册登录账号

网站地址:https://www.iconfont.cn/

该网站可通过GitHub或新浪账号进行登录

下面是网站的首页

阿里矢量图标库的使用

2、查找图标

在中间输入框输入想要查找的图标,。以‘home’为例,点击搜索,即可得到以下页面。

阿里矢量图标库的使用

3,将图表添加至项目。

选中自己需要的图标,将其添加入库,这时再点击页面右上角的购物车图标

阿里矢量图标库的使用阿里矢量图标库的使用

弹出以下页面,点击添加至项目,如果是新建项目,点击右边的加号图标,然后点击确定

 

 

 

阿里矢量图标库的使用阿里矢量图标库的使用

4,在项目中使用图标

添加至项目后会跳转至以下页面,左边显示项目的名称,右上角可以添加项目成员,共享这些图标。要使用这些图标的话就需要下载至本地了。

阿里矢量图标库的使用

点击下载至本地,会得到一个压缩文件,解压文件,得到以下内容

阿里矢量图标库的使用阿里矢量图标库的使用

阿里矢量图标库的使用

将上图5个文件放入项目的目录下,并在main.js文件中引入css文件。

用浏览器打开fontclass.html文件,将图标的类名添加至 i 标签即可,如下所示。

阿里矢量图标库的使用

<class=”iconfont icon-home”></i>

 

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/166409.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • 进销存源码|ERP多仓库管理系统全开源php源码

    进销存源码|ERP多仓库管理系统全开源php源码  进销存(ERP)源码是用来管理企业数据的软件工具。进销存系统帮助不同的组织处理企业的不同部门。不同部门如收货、库存管理、客户订单管理、生产计划、发货、会计、人力资源管理等业务职能。基本上,它是将企业的计划、生产、销售和营销工作整合到一个管理系统中的实践。它将跨不同部门的所有数据库合并到一个单一的数据库中,该企业的所有员工都可以轻松访问该数据库。它有助于自动化执行业务流程所涉及的任务。    进销存源码演示及资源获取:e.csymzs.top    使用进销存前:    在使用进销存源码之前,

    2022年5月31日
    118
  • unity c++ c#(3d加工编程软件)

    一、前言这篇文章主要是给零基础想要Unity入门的关于C#编程的一些意见二、参考文章unity中的C#编程-零基础(Unity2017)三、正文1.什么是C#编程语言?微软官方出版2.编程工具(IDE)3.创建第一个C#代码4.场景的保存和脚本的保存5.关于日志输出(指控制输出,其中Log有三类:正常、警告、错误输出)6.变量7.方法的定义和调…

    2022年4月14日
    49
  • 妳不能不知道的部落格(zz)

    妳不能不知道的部落格(zz)妳不能不知道的部落格這是我給 微電腦傳真 的稿子 據說是刊登在五月號 第 207 期 上但是由於邀稿者離職之故 大概不會刊登出來了 以下為全文 共約一萬五千字 請注意這些內容使用需註明出處 未經允許不得作為商業使用 商業用書面印刷權目前僅授予微電腦傳真雜誌 妳不能不知道的部落格 Blog 是甚麼碗糕啊 源起 Blog 指的並非任何一套特定的軟體 也不是特定的系統或服務 Blog 實

    2025年7月6日
    0
  • redis 时间范围查询

    redis 时间范围查询这算是一种变相的在redis上面实现时间范围查询。我的使用场景介绍一下:redis在我们的项目里面是用来存储实体映射关系,比如user&gt;pc这种一度关联,会统计某一个用户在一段时间内总共有多少个关联关系;当前事件携带的关联关系是否是新的。…

    2022年6月18日
    22
  • jenkins 邮件_jmeter测试报告生成

    jenkins 邮件_jmeter测试报告生成前言前面已经实现在jenkins上展示html的测试报告,接下来只差最后一步,把报告发给你的领导,展示你的劳动成果了。安装EmailExtensionPlugin插件jenkins首页-

    2022年7月31日
    3
  • 解决IBasicVideo::GetCurrentImage返回0x8000ffff(E_UNEXPECTED Catastrophic failure)错误

    解决IBasicVideo::GetCurrentImage返回0x8000ffff(E_UNEXPECTED Catastrophic failure)错误经过查阅一番资料后,得到如下的解决方案:方案1:使用替代的接口ISampleGrabber,代替IBasicVideo,具体调用的函数为:ISampleGrabber::GetCurrentBuffer.可以参考文章:dshow中使用SampleGrabberfilter抓取图像。在我的开发环境win10+vs2013下没能找到ISampleGrabber接口;而在官方文档中提到ISa…

    2022年9月24日
    1

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号