阿里巴巴矢量图标库的使用

已于 2022-03-18 05:13:39 修改
阅读量885 收藏 1
点赞数
文章标签： vue.js
于 2022-03-18 04:42:43 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/zhuyuan123456/article/details/123565051
版权

第一步，在百度搜索

watermark,type_d3F5LXplbmhlaQ,shadow_50,text_Q1NETiBASlNPTlDvvIQ=,size_20,color_FFFFFF,t_70,g_se,x_16

 第二步登陆账号

watermark,type_d3F5LXplbmhlaQ,shadow_50,text_Q1NETiBASlNPTlDvvIQ=,size_20,color_FFFFFF,t_70,g_se,x_16

 第三步，选择我的项目

watermark,type_d3F5LXplbmhlaQ,shadow_50,text_Q1NETiBASlNPTlDvvIQ=,size_20,color_FFFFFF,t_70,g_se,x_16

 第四步，点击新建项目

watermark,type_d3F5LXplbmhlaQ,shadow_50,text_Q1NETiBASlNPTlDvvIQ=,size_20,color_FFFFFF,t_70,g_se,x_16

 第五步

watermark,type_d3F5LXplbmhlaQ,shadow_50,text_Q1NETiBASlNPTlDvvIQ=,size_20,color_FFFFFF,t_70,g_se,x_16第六步，搜索你想要的图标样式

 

watermark,type_d3F5LXplbmhlaQ,shadow_50,text_Q1NETiBASlNPTlDvvIQ=,size_20,color_FFFFFF,t_70,g_se,x_16

 

第七步

watermark,type_d3F5LXplbmhlaQ,shadow_50,text_Q1NETiBASlNPTlDvvIQ=,size_20,color_FFFFFF,t_70,g_se,x_16

 

第八步

watermark,type_d3F5LXplbmhlaQ,shadow_50,text_Q1NETiBASlNPTlDvvIQ=,size_20,color_FFFFFF,t_70,g_se,x_16

 第九步

watermark,type_d3F5LXplbmhlaQ,shadow_50,text_Q1NETiBASlNPTlDvvIQ=,size_20,color_FFFFFF,t_70,g_se,x_16

 第十步，加入项目

watermark,type_d3F5LXplbmhlaQ,shadow_50,text_Q1NETiBASlNPTlDvvIQ=,size_20,color_FFFFFF,t_70,g_se,x_16

 第十一

watermark,type_d3F5LXplbmhlaQ,shadow_50,text_Q1NETiBASlNPTlDvvIQ=,size_20,color_FFFFFF,t_70,g_se,x_16

 第十二

watermark,type_d3F5LXplbmhlaQ,shadow_50,text_Q1NETiBASlNPTlDvvIQ=,size_20,color_FFFFFF,t_70,g_se,x_16

 第十三

watermark,type_d3F5LXplbmhlaQ,shadow_50,text_Q1NETiBASlNPTlDvvIQ=,size_20,color_FFFFFF,t_70,g_se,x_16

 第十四

watermark,type_d3F5LXplbmhlaQ,shadow_50,text_Q1NETiBASlNPTlDvvIQ=,size_20,color_FFFFFF,t_70,g_se,x_16

 第十五

watermark,type_d3F5LXplbmhlaQ,shadow_50,text_Q1NETiBASlNPTlDvvIQ=,size_20,color_FFFFFF,t_70,g_se,x_16

 第十六

 

watermark,type_d3F5LXplbmhlaQ,shadow_50,text_Q1NETiBASlNPTlDvvIQ=,size_20,color_FFFFFF,t_70,g_se,x_16

 第十七

watermark,type_d3F5LXplbmhlaQ,shadow_50,text_Q1NETiBASlNPTlDvvIQ=,size_20,color_FFFFFF,t_70,g_se,x_16

 第十八

watermark,type_d3F5LXplbmhlaQ,shadow_50,text_Q1NETiBASlNPTlDvvIQ=,size_20,color_FFFFFF,t_70,g_se,x_16

 第十九

 

watermark,type_d3F5LXplbmhlaQ,shadow_50,text_Q1NETiBASlNPTlDvvIQ=,size_20,color_FFFFFF,t_70,g_se,x_16

 

 

JSONP＄
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
阿里巴巴矢量图标库使用
weixin_68658847的博客
07-03 881
阿里巴巴矢量图标库使用
如何在项目中使用阿里巴巴矢量图标
最新发布
03-27
阿里巴巴矢量图标库，通常称为Iconfont，提供了丰富的图标资源，支持多种格式，包括SVG、Webfont、CSS等。下面我们将详细探讨如何在项目中集成和使用这些图标。 首先，我们需要了解`iconfont.css`和`iconfont.js`这...
阿里巴巴 矢量图 流程图 json 格式
08-17
https://www.iconfont.cn/ 阿里巴巴 矢量图 https://app.diagrams.net/ 流程图 https://tool.jisuapi.com/json.html json 格式
json动画使用
yufumatou的博客
09-24 4455
前言：json动画文件是有bodymovin(开源的After Effects插件)导出的，播放动画使用Airbnb开源的动画渲染库Lottie，下面是制作使用的整个工作流程。由于Lottie对json动效属性不是所有都支持的，所有在制作前要查看Lottie最新支持功能对照表 一、制作json动画文件 方式1、通过上面描述的流程制作 方式2、访问由DesignBarn公司推出的Lottie动画社区，查找我们需要的动画，不仅可以下载还支持编辑、预览、生成GIF等功能 方式3、访问由阿里提供的犸良平
阿里巴巴图标矢量库使用方法详解，适用于各种框架
qq_61838643的博客
08-10 6248
官网使用了三种方法，我将逐一讲解，有不对之处还请各位大佬指正添加到购物车，选择完成后点击上方导航栏图标之后选择添加至项目（没有项目可以临时创建一个）选择完成之后会自动跳转至资源管理界面，查看刚才的选择的图标如果是vue项目，可以把代码复制在app.vue的style标签里，如果没有使用框架，直接写在css文件里引入即可。
图标库(阿里巴巴)
qq_45832807的博客
02-25 184
将所需要的图标加到购物车里面 将图标加入项目 使用图标
阿里巴巴图标库
qq_41304707的博客
11-20 831
怎样在项目中使用阿里巴巴图标库 第一步 搜索需要你所需要的图标，并加入购物车 第二步 打开页面右上角的购物车，查看你添加的图标 第三步 选择添加项目按钮 第四步 点击确定 第五步 点击下载到本地按钮 第六步 将下载的zip解压，得到以下文件 第七步 在html页面中引入iconfont.css文件 第八步 复制你所需要图标的代码 在页面中应用 ...
copy_alibaba:一键复制阿里巴巴矢量图标库SVG图标，无需下载
05-11
一键复制阿里巴巴矢量图标库SVG图标，无需下载 阿里巴巴矢量图标库提供了大量的图标可供选择，当然，在尊重版权的前提下拿来放在项目上。 苦于每次想要使用图标库 的图标都需要下载图标===拉到文件夹====写文件路径/...
阿里巴巴矢量图标批量下载 IconontDownload.js
09-04
如何批量下载阿里巴巴矢量图标库的图标？ 1.打开阿里巴巴矢量图标库的项目；2.按F12打开浏览器的开发者工具，复制并执行自动下载图标的代码。
阿里矢量图标库
04-26
阿里矢量图标库
CSS运用阿里巴巴矢量库快速在对应位置加上好看的图标效果(实例代码)
11-21
进入阿里巴巴矢量图标库 阿里巴巴矢量图标库 选择喜欢的图标的，点击添加到库 选择完之后，点击右上角的购物车图标（前提是已经登录，推荐使用GitHub登录） 然后在右侧中点击添加至项目 之后在个人主页中可以...
阿里巴巴字体图标库
1853
09-15 1130
阿里巴巴字体图标库 网址 https://www.iconfont.cn/
阿里巴巴图标库，分享各位
cailiheng536的专栏
06-21 875
作为一个前后端都开发的开发人员，有时候因为客户提出的小小样式改动而苦恼，特别是找个像样ICON要花费1小时，下面我推荐大家可以用阿里巴巴的图标库，在此也感谢阿里巴巴 https://www.iconfont.cn/collections/detail?spm=a313x.7781069.1998910419.d9df05512&cid=17135 ...
阿里巴巴矢量图标库
weixin_33850015的博客
02-25 216
Iconfont-阿里巴巴矢量图标库 示例 转载于:https://www.cnblogs.com/yadongliang/p/10434530.html
使用 阿里巴巴矢量图标库
08-13
要在Uni-app中使用阿里巴巴矢量图标库，可以按照以下步骤进行： 1. 注册并登录阿里巴巴矢量图标库（https://www.iconfont.cn/）的账号。 2. 在阿里巴巴矢量图标库中搜索需要的图标，选择并添加到自己的项目中。 3. 在项目中创建一个字体图标库文件夹，将从阿里巴巴矢量图标库下载的字体文件（通常是.ttf或.otf格式）放入该文件夹中。 4. 在项目的`index.html`文件中，通过`<style>`标签引入字体图标库，并设置其`font-family`属性。例如： ```html <style> @font-face { font-family: 'iconfont'; src: url('path/to/iconfont.ttf') format('truetype'); } </style> ``` 5. 在需要使用字体图标的地方，使用`<text>`或其他合适的组件，并设置`class`属性为图标对应的类名。例如： ```html <text class="iconfont icon"></text> ``` 在上面的代码中，`iconfont` 是字体图标库的类名，`` 是具体的图标字符码点。 6. 根据需要设置图标的样式，如颜色、大小等。可以通过内联样式或CSS类来实现。 请注意，具体使用哪个类名和字符码点取决于你所选择的图标和下载的字体文件。在阿里巴巴矢量图标库中，每个图标都有对应的类名和字符码点，可以在图标库中查找并使用。 希望这些步骤能帮助你成功使用阿里巴巴矢量图标库！如果还有其他问题，请随时提问。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值