这是之前留下的博客，由于一堆博客没写完，本周周末做了个补充，可能内容上会有点不太斜街，请见谅...
iconfont-阿里矢量图标库 登录/注册打开阿里矢量图标库地址：https://www.iconfont.cn/home/index，并使用 github 账号注册/登录
搜集需要的图标选中菜单的图标库，然后点击页面右侧的红色搜索按钮
如下图是我搜索 地图 出来的图标库列表
在首页搜索你想要的图标（中英文都 ok）
有两种方式，下文以本地使用的方式展开
1.使用在线地址引入 iconfont，每次线上改完就生效貌似每次改完地址都会变，后续自己测试一下
2.下载到本地使用，每次改完重新下载压缩包替换
更改图标1.直接编辑图标做更改，然后下载替换
对图标在网格中的位置、大小、旋转角度进行调整
2.上传新图标来替换
点击商场替换 icon
找到了加到购物车，然后添加至项目，然后下载替换即可
自制 svg 图标，上传到 iconfont 上找设计同事要来 svg 格式的图标，传到 iconfont 上，添加至项目，下载替换原文件
可以一次选中多个图标上传
直接在项目里删除，然后重新下载文件或重新生成链接应用即可
接手老项目开发（扩展图标）今天一探索，对于 iconfont 还存在着一个问题
对于接手的老项目，想要扩展字体图标怎么办？
如果有在线 iconfont 项目，把你拉进去作为项目成员当然好，如果人家离职了，没有在线 iconfont 项目或者不拉你进去？
方案一：新建 iconfont 项目，编辑项目，更改 Font Family 为其他值（推荐，方便再后续维护以及自己找图标）没有项目用的 iconfont 项目，就只能自己新建一个咯？
注意 Font Family 写另外的值
然后往里面添加图标...
下载 iconfont 项目图标库到本地，放到项目目录下
demo 目录结构如下
. │ index.html │ ├─iconfont │ demo.css │ demo_index.html │ iconfont.css │ iconfont.eot │ iconfont.js │ iconfont.json │ iconfont.svg │ iconfont.ttf │ iconfont.woff │ iconfont.woff2 │ ├─iconfont-new │ demo.css │ demo_index.html │ iconfont.css │ iconfont.eot │ iconfont.js │ iconfont.json │ iconfont.svg │ iconfont.ttf │ iconfont.woff │ iconfont.woff2 │ └─img bg.png页面里引入该 css，在页面上使用
两个 iconfont 项目图标库使用案例如下（主要是新的 iconfont 图标怎么用，旧的不用管，直接替换就行了）
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta content="width=device-width, initial-scale=1.0"> <title>Document</title> <!-- 老 iconfont 项目的引用 --> <link href="http://www.likecs.com/iconfont/iconfont.css"> <!-- 新 iconfont 项目的引用 --> <link href="http://www.likecs.com/iconfont-new/iconfont.css"> </head> <body> <!-- 老 iconfont 项目的图标引用方式（不变） --> <i></i> <!-- 新 iconfont 项目的图标引用方式，iconfont 要改为创建项目时使用的 Font Family 名 --> <i></i> </body> </html> 方案二：国外平台 iconmoon 扩展（不需要翻墙，访问速度也还好）https://icomoon.io/