阿里巴巴矢量图标如何使用

目录

一、网址

二、登陆

三、按需要搜索查找图标

四、添加购物车

五、打开购物车

六、添加到项目中

七、进入我的项目

八、复制链接

在链接前加前缀 http://

九、在页面文件中引入

十、使用

注意点


一、网址

iconfont-阿里巴巴矢量图标库

二、登陆

阿里巴巴矢量图标如何使用_第1张图片

选择账号登陆,没有自行注册

三、按需要搜索查找图标

阿里巴巴矢量图标如何使用_第2张图片

 搜索并选中

四、添加购物车

阿里巴巴矢量图标如何使用_第3张图片

选中并添加购物车

五、打开购物车

阿里巴巴矢量图标如何使用_第4张图片

打开购物车

六、添加到项目中

阿里巴巴矢量图标如何使用_第5张图片

添加到项目

七、进入我的项目

阿里巴巴矢量图标如何使用_第6张图片

进入我的项目

八、复制链接

在链接前加前缀 http://

九、在页面文件中引入

阿里巴巴矢量图标如何使用_第7张图片

引入链接

十、使用

阿里巴巴矢量图标如何使用_第8张图片

注意点

1、链接前面必须带http://

2、使用到时候 class里面必须要加 iconfont的类。

3、后面的跟的代码就是在项目管理中生成的代码。

4、可以完全当成字体用,可以设置font-size 和 color属性。

5、生成代码之后,如果后面又添加图标,就需要重新生成链接,否则无效。

参考:最简单使用阿里巴巴矢量图标库 - 简书 (jianshu.com)

你可能感兴趣的:(项目过程中的问题,vue,学习总结,前端,css,vue.js)