小程序引入阿里云矢量图库图标

简介

阿里云矢量图库(Aliyun Vector Icon Library)是阿里云提供的一个图标库,为开发者和设计师提供了丰富的矢量图标资源,用于在网页、移动应用和其他设计项目中使用。

使用阿里云矢量图库,你可以快速搜索、选择和下载各种类型的矢量图标,满足你的设计需求。该图库包括了多个图标集合,涵盖了不同主题和领域的图标,例如常用的 UI 图标、通用图标、品牌图标等。

要使用阿里云矢量图库,你可以访问官方网站(https://www.iconfont.cn/),注册一个账号,并进行登录。登录后,你可以浏览和搜索图标,将你需要的图标添加到你的项目中,并下载相应的图标文件(通常是 SVG 格式)。

此外,阿里云矢量图库还提供了一些便捷的功能,如图标的在线编辑、自定义图标库、图标的样式更改等,以满足不同的设计需求和个性化要求。

请注意,阿里云矢量图库可能有一些使用限制和许可要求,请在使用前仔细阅读并遵守相关的使用条款和许可协议。

前端引入步骤

1、在iconfont官网平台生成css代码

创建一个项目(进入我的项目,点击创建项目)

小程序引入阿里云矢量图库图标_第1张图片

点击 + 号创建项目

小程序引入阿里云矢量图库图标_第2张图片

输入相关的信息,创建项目

小程序引入阿里云矢量图库图标_第3张图片

在图标库找到对应的图标,点击购物车

小程序引入阿里云矢量图库图标_第4张图片

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-0bjSUKtR-1689579204570)(E:\PRD\Images\image-20230706143732694.png)]

点击添加至项目 --》选择对应的项目 --》点击确定

小程序引入阿里云矢量图库图标_第5张图片

这里我只提供一种方法(Font class),一共有三种,感兴趣的自己去百度吧

找到对应的项目 --》点击 Font class --》查看在线链接

小程序引入阿里云矢量图库图标_第6张图片

点击生成,进行相关css文件生成

小程序引入阿里云矢量图库图标_第7张图片

将复制的url在浏览器中打开

小程序引入阿里云矢量图库图标_第8张图片

小程序引入阿里云矢量图库图标_第9张图片

2、进行小程序引入图标

将上面浏览器中显示的css代码复制到 wxss文件中

小程序引入阿里云矢量图库图标_第10张图片

通过iconfont 和图标名称进行引入

小程序引入阿里云矢量图库图标_第11张图片

引入成功

你可能感兴趣的:(小程序,阿里云,云计算)