如何把阿里图标库的图标生成代码并应用于自己的项目

• 花匠小妙招
• 2025-05-13 17:36

有时候需要用很多图标去完成一定的页面效果和工作展现，框架内置的图标可能满足不了我们的需求，有个很好的图标库想必大家都知道-----就是阿里图标库。那么我们如何才能够把阿狸图标库的图标引用到自己的项目中呢？耐着性子往下看吧！
阿里图标库地址：https://www.iconfont.cn/
1.根据所需搜索到想要的图标，鼠标悬停，点击添加到购物车

2.点击购物车

3.点击添加至项目

4.选择添加到一个项目里面，点击确定

5.点击font class 的选项，可以看到你添加过的图标，下面的英文对应的是图标代码，点击下载至本地。

6.你会的到一个download的压缩包，解压文件

7.复制除第一个二文件其余的文件至你的项目资源目录

8.引用iconfont.css至你的前端项目 请注意引用文件路径的正确性。

9.使用的时候

第一个类名是固定的iconfont 第二个类名是你所需要的类名，取自于fontClass代码

相关知识

如何把阿里图标库的图标生成代码并应用于自己的项目
Android使用字体图标库
图标字体(IconFont)制作
图片转web字体库，如何制作web字体库
CSS3中常用字体图标库总结
unity 白色材质曝光过曝
python 生成玫瑰花代码
Font Builder: 快速构建你的自定义字体库
怎么用java代码生成玫瑰花
阿里字体库使用教程

网址: 如何把阿里图标库的图标生成代码并应用于自己的项目 https://m.huajiangbk.com/newsview1946630.html