阿里巴巴矢量图的使用方法详细教程

1.在浏览器搜索阿里巴巴矢量图标库,进入官网后需要先登录,用微博登录就可以。

阿里巴巴矢量图的使用方法详细教程_第1张图片

阿里巴巴矢量图的使用方法详细教程_第2张图片

2.登陆成功后,在首页输入关键字搜索

阿里巴巴矢量图的使用方法详细教程_第3张图片

3.加入购物车,点击购物车,添加至项目,新建项目,添加至新建的项目

阿里巴巴矢量图的使用方法详细教程_第4张图片

 

 

阿里巴巴矢量图的使用方法详细教程_第5张图片

 阿里巴巴矢量图的使用方法详细教程_第6张图片阿里巴巴矢量图的使用方法详细教程_第7张图片

 

阿里巴巴矢量图的使用方法详细教程_第8张图片

4.添加项目之后,点击unicode,点击下载本地,找到自己项目的路径,

阿里巴巴矢量图的使用方法详细教程_第9张图片

阿里巴巴矢量图的使用方法详细教程_第10张图片

 

阿里巴巴矢量图的使用方法详细教程_第11张图片

 

 

 5.在html页面引入css,  并且添加类,一定要先添加iconfont.阿里巴巴矢量图的使用方法详细教程_第12张图片

6.在网页中找到想要添加的图片,复制类名,添加到元素中。

阿里巴巴矢量图的使用方法详细教程_第13张图片

阿里巴巴矢量图的使用方法详细教程_第14张图片 

阿里巴巴矢量图的使用方法详细教程_第15张图片 

 

 

 

 

 

 

 

 

 

你可能感兴趣的:(vscode,html)