了解ttf字体文件本身的现有Unicode代码后，如果阿里巴巴图库中所选图标的Unicode代码与其重复，请点击左下角的修改按钮进行修改，今天小编主要给大家分享网页制作如何增加矢量图标，希望对你们有帮助!

众所周知，电脑中有两种图像，一种叫做点阵图(位图)，另一种叫做矢量图。

点阵图放大图片时，看起来会模糊不清，但矢量图不会。因此，越来越多的人开始使用矢量图作为网页图标。许多人会遇到这样的情况，他们会在网站上下载一个带有矢量图标的字体文件，在后期开发中，图标需要不断更新和增加。如果继续下载ttf字体文件，它会占用大量空间，为了增加图标，会下载几个文件的情况。

首先，我推荐两个有矢量图标库的网站：

阿里巴巴矢量图标库、谷歌浏览器里的矢量图库

1.如何找到需要的图标

首先，进入网页:阿里巴巴矢量图标库；

在搜索框中输入所需的图标名称，如“主页”、“策略”，并确认;

找到你想要的图标，向上移动鼠标，选择左下角的“购物框”;

在右上角的“存储架”中，将出现一个已收藏的图标;

然后搜索“策略”，找到图标并将其放入“存储架”;

单击“登录”选择一种登录方法;

现在将鼠标移动到“存储架”存储，单击“另存为项目”，然后单击“保存”。

2.将图标添加到已有的字体文件

现在找到我们已经有的字体文件“new-iconfont.ttf”，用“fontlab”软件打开该文件;

打开后，可以看到ttf字体文件中的图标，每个图标都有自己的统一代码，因为每个图标的统一代码相当于自己的“身份证”。当需要使用外部文件中的图标时，需要此“身份证”;

双击其中一个图标，可以清楚地看到图标上方的“Unicode”，该图标是“E808”;

了解ttf字体文件本身的现有Unicode代码后，如果阿里巴巴图库中所选图标的Unicode代码与其重复，请点击左下角的修改按钮进行修改;

确认修改后，单击“下载到本地”并解压缩，将出现几个字体文件和css文件;

现在你可以使用Fontlab软件打开里面的ttf文件;

选择要增加的两个图标，然后单击鼠标右键中的“复制”，然后返回到先前字体的文件;

最后选择一个图标，右键单击选择“Append Glyphs”以增加所需的图标;

使用快捷方式Gtrl+Alt+G将其保存为ttf文件。

尊重原创文章，转载请注明出处与链接：https://www.*/jsjzx/Web_Design/627853.html，违者必究！