前端开发中,经常会用到各种各样的图标(icon)。这些icon,如果每个都要自己去做,那真的是耗时又耗力。但是,有了阿里巴巴矢量图标库这样的平台后,一切都变得简单了起来。
本文以此平台为例,演示如何搜集并下载项目所需的icon资源。
访问官网并登录
访问iconfont官网,并且登录。推荐大家登录以后,再做后续的一些操作。登录以后,不仅可以收藏icon,并且可以创建自己的icon项目。这个icon项目,可以非常方便地对icon的管理(删除、添加等)。
搜索图标
首页有个大大的“搜索框”,就像下面这样。
输入关键字,比如“购物车”,就会得到如下的结果。
添加图标
你可以从这些购物车icon中,选择你需要的,点击将其加入购物车。
icon挑选完毕后,点击右上角的“购物车”,选择“添加至项目”。
新增一个项目,比如“shop”。
管理项目
下载资源
点击“下载至本地”,即可获取该项目中的icon资源。
编辑项目
这里可以对font-family等进行修改,这样就可以解决项目中引入的字体库,font-family名称冲突的问题。