阿里矢量图标库的使用

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


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

1、注册登录账号

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

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

下面是网站的首页

阿里矢量图标库的使用

2、查找图标

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

阿里矢量图标库的使用

3,将图表添加至项目。

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

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

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

 

 

 

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

4,在项目中使用图标

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

阿里矢量图标库的使用

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

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

阿里矢量图标库的使用

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

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

阿里矢量图标库的使用

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

 

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

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

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

相关推荐

  • pycharm注释多行_eclipse多行注释快捷键

    pycharm注释多行_eclipse多行注释快捷键1、Pycharm同时编辑多行:alt+shift+ctral+鼠标左键2、Pycharm同时多行注释:多行选中后ctrl+\

    2022年8月26日
  • 5500xt挖矿算力_rx470d etc算力

    5500xt挖矿算力_rx470d etc算力…每日平均收益为R$4。RX5700XT表现出色的其他加密货币包括:以太坊经典(ETC),拉文币(RVN),天堂协议XHV和Beam(BEAM)。可以用于采矿的同一系列图形卡中的其他型号是RX5700,RX5600XT和RX5500XT。但是,与RX5700XT相比,这些其他型号的利润率较低。NvidiaRTX2060超级频率:1470MHz至1670MHzV…

    2022年6月14日
  • HTML 5 Web 存储

    HTML5提供了两种在客户端存储数据的新方法:localStorage-没有时间限制的数据存储sessionStorage-针对一个session的数据存储html5webstora

    2021年12月25日
  • 五分钟了解Mysql的行级锁——《深究Mysql锁》「建议收藏」

    五分钟了解Mysql的行级锁——《深究Mysql锁》「建议收藏」我们首先需要知道的一个大前提是:mysql的锁是由具体的存储引擎实现的。所以像MyISAM和InnoDB引擎的锁实现机制是有区别的。Mysql有三种级别的锁定:表级锁定、页级锁定、行级锁定表级锁定参考:三分钟了解Mysql的表级锁——《深究Mysql》页级锁定参考:[三分钟了解Mysql的页级锁——《深究Mysql》]一、定义每次锁定的是一行数据的锁机制就是行级别锁定(r…

    2022年4月30日
  • uint和int的区别_int32和uint32

    uint和int的区别_int32和uint32本次测试的环境是Mac系统下,CPU64位。注意:go语言中的int的大小是和操作系统位数相关的;如果是32位操作系统,int类型的大小就是4字节;如果是64位操作系统,int类型的大小就是8个字节1、测试不同int类型占用字节数大小1.1、测试有符号int类型import( “testing” “unsafe” “math” “fmt”)funcTestIntSize(t*testing.T){ fmt.Println(“不同int类型占用的字节数大小:”)

    2022年8月15日
  • QQ第三方登录报错error=-1

    QQ第三方登录报错error=-1

    2021年10月25日

发表回复

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

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