- 综合排序
- 最热优先
- 最新优先
- 来自专栏运维随笔
如何添加调用矢量图标库
前言 为什么站长要写一篇关于个人网站如何添加调用矢量图标库？因为图标好多，好看！！！ 一、矢量图标库账号 如果您已有账号，可以忽略此步骤，如图登录方式有四种，一个是手机号注册登入，一个是Github另外一个是微博，域账号我们用不了，无论哪种都是关联账号，没有注册，选择一种登录即可，站长这边使用手机号注册 Markup <link href="阿里巴巴图标代码" rel="stylesheet"> 将“阿里巴巴图标代码”换成刚刚复制好的代码，如上图蓝色区域所示，右侧开启接口，点击底部保存，回到阿里巴巴图标库网站 回到网站首页，查看效果 最后，可能你会发现，图标安装之后格局有一丢丢的变化，图标大小不统一，因为默认的图标库的16号字体，网站默认使用的是14号字体，打开主题设置 >> 首页设置 >> 自定义css选项 （其他网站将此css样式加入css表即可） CSS i.icon{font-size:inherit;} 五、其他一些细节设置 点击图片会出现如下图编辑功能可以调整图标颜色，大小等等 六、总结 在矢量图标库新建一个项目
1.7K30编辑于 2022-02-14 - 来自专栏喇叭的学堂
阿里巴巴矢量图标库在线链接使用图标
1、去官网 iconfont-阿里巴巴矢量图标库 如果没有注册的先注册一下 2、搜索你需要的图标加入项目 搜索图标 找到心仪的图标后，添加入库，添加成功会出现虚线框，而右边小车上会出现添加图标的数量 点击小车图标 ，进入 添加到项目里面，如果没有项目，就创建一个 添加完毕后，就会跳转到另一个页面 点击进入改变图标默认样式大小、颜色-方法1 【不推荐】 3、使用图标 样式文件css引入（如果图标样式改变，还需要更新
99910编辑于 2024-03-11 - 来自专栏Kirin博客
阿里巴巴矢量图标库（iconfont）批量全选的方法
阿里巴巴矢量图标库: https://www.iconfont.cn/ 浏览器打开调试面板，进入 console 调试面板（Google浏览器快捷键F12）或者在页面空白处，点击右键->审查元素(检查) 复制下面的代码去粘贴 1 2 3 4 var span = document.querySelectorAll('.icon-cover'); for (var i = 0, len = span.length
1.9K20发布于 2020-09-22 - 来自专栏颜汐小屋
WordPress引用阿里巴巴矢量图标库添加彩色图标
现在大部分博客图标都采用Font Awesome图标库，因为Font Awesome图标库满足了大部分用户的需求了，但做为喜欢花里胡哨的我们是不够的，Font Awesome图标库的图标不仅没有彩色的图标 所以只能引入其他的矢量图标库，今天我就分享一下WordPress引用阿里巴巴矢量图标库的彩色图标。 阿里巴巴矢量图标库网址：https://www.iconfont.cn/图片教程开始第一步：阿里巴巴矢量图标库官网 —> Github或者新浪微博登录第二步：然后自己通过搜索框找到自己喜爱的图标并添加至购物车
1.4K30编辑于 2023-10-06 - 来自专栏李洋博客
怎么使用阿里巴巴矢量图标库图文教程
确保数据库不会丢失，嗐，无奈啊~~~ 好了，不废话了，今天教教大家怎么设置导航图标和使用阿里巴巴代码，话说奥森图标貌似没在更新（或许是我没关注），所以在最新的主题模板明信片上将奥森图标统一换成了阿里巴巴图标库 阿里巴巴图标库：预览字体 （采用：Font class 模式） 1.首先注册阿里巴巴图标库账号 如果您已有账号，可以忽略此步骤，如图登录方式有两种，一个是Github另外一个是微博，阿里域账号我们用不了 登录之后我们随便搜索一个图标，比如首页(home)，会出现很多图标，选择一个您喜欢的图标，然后点击加入图库， 就是购物车的图标，也可以收藏起来，如图： 然后右上角购物车会有提示，点击右上角购物车图标如图： 3. 代码格式如下： <link href="阿里巴巴图标代码" rel="stylesheet"> 将“阿里巴巴图标代码”换成刚刚复制好的代码，如上图蓝色区域所示，右侧开启接口，点击底部保存，回到阿里巴巴图标库 最后的最后，你会发现，图标安装之后格局有一丢丢的变化，这就是我之前说的，图标大小不统一，因为阿里巴巴默认的图标库的16号字体，主题模板默认是14号字体，打开主题设置，全局设置，添加如图代码即可解决。
2.8K60编辑于 2023-03-03 - 来自专栏TopFE
VUE项目中使用IconFont 阿里巴巴矢量图标库
近日为了方便前端同事图标的使用,在现有的项目中引入了一下 阿里巴巴矢量图标库iconfont 现记录如下 登录iconfont平台后,创建一个项目,然后将svg的图标导入或拖拽到项目中, 再项目详情界面
1.2K20编辑于 2022-01-24 - 来自专栏HTML5学堂
iconfont字体图标库
3 浏览器再根据CSS里面设置的font-family查找对应的字体文件。如果CSS里面没有设置字体，就会使用浏览器的默认设置。如果有自定义字体@font-face网络字体，则加载对应字体文件。 3、使用iconfont非常方便，和设置网页字体一样，可以利用CSS来定义图标大小、图标颜色、图标透明度等 iconfont的劣势 1、利用CSS无法方便的定义多彩的icon，大部分是单一颜色。 在这边微信小编给大家推荐一个工具：Iconfont-阿里巴巴矢量图标库。 ? 1、打开http://www.iconfont.cn，选择图标库导航（注册一个账号，方便操作）。 2、根据项目需求选择一个图标库点击进去，然后选择图标。 ? 3、下载打包好的图标，里面包含了图标库和代码实例。 ? 如何在文本或伪元素当中实现iconfont ? 提示：阿里巴巴矢量图标库下载的时候提供了详细的代码实例。 欢迎沟通交流~HTML5学堂
6.1K60发布于 2018-03-13 - 来自专栏机器人技术与系统Robot
3D矢量和6D矢量机器人建模的对比
基于6D矢量的机器人动力学是由学者Featherstone首先提出，并被机器人其他很多动力学建模软件广泛应用。包括开源机器人软件kdl. 下面给出基于3D矢量和6D矢量的机器人动力学建模。 1 3D矢量 image.png image.png image.png 2 6D空间矢量 两个刚体 和 铰接成一个刚体，关节处无驱动力矩， 是旋转轴。 image.png 对比上述结果可以看出来，基于6D矢量和3D矢量建立的机器人动力学模型是完全一致的，而基于6D矢量的计算量则相对来说更小。 3 多体系统 image.png 铰接体（Articulated-Body， AB） 是指多个具有相对运动的刚体通过铰链连接而成的系统。
3.5K327257发布于 2020-10-24 - 来自专栏PowerBI战友联盟
Power BI 图标库大全
如果你嫌弃麻烦，也可以使用我们为大家整理的图标库。 当你想使用的时候，唯一要做的说就是复制和粘贴即可。 一切就好看了。 快来使用图标库来让你的设计更加富有细节吧。
1.7K20编辑于 2022-04-02 - 来自专栏xinxin的随笔记录
引入阿里图标库
hexo引入阿里图标库 （记录一下） 首先在https://www.iconfont.cn/?
1.1K20编辑于 2022-03-29 - 来自专栏站长的编程笔记
面向设计师、开发者的开源免费图标库
1. iconfont ---- https://www.iconfont.cn 国内功能很强大且图标内容很丰富的矢量图标库，提供矢量图标下载、在线存储、格式转换等功能。 阿里巴巴体验团队倾力打造，设计和前端开发的便捷工具 前端 UI 框架 layui 的内置图标就是取材于阿里巴巴矢量图标库，当内置的图标不够使用时，可以在阿里巴巴矢量图标库自行查找图标进行扩展，通过 css Remix Icon ---- http://remixicon.cn Remix Icon 是一套面向设计师和开发者的开源图标库。 适合用于小程序、移动端的底部菜单图标 3. iconPark ---- https://iconpark.oceanengine.com IconPark 图标库是一个由字节跳动出品，通过技术驱动矢量图标样式的开源图标库 Font Awesome ---- https://fontawesome.com 在很多基于 Bootstrap 的后台管理系统中都会使用到这个图标库，这个是国外的网站，访问会比较慢
1K20编辑于 2022-12-28 - 来自专栏前端说吧
字体图标库使用方法
一些字体图标库的网站 https://icomoon.io/app/#/select http://www.iconfont.cn/ http://www.bootcss.com/ http://www.bootcss.com
3.8K70发布于 2018-05-17 - 来自专栏Opensource翻译专栏
如何用Scratch 3绘制矢量图形 【Gaming】
什么是矢量？ 矢量绘图不同于使用常规绘图应用程序绘图。无论放大或缩小多远，矢量图像看起来都很平滑，没有像素化。矢量可以创建任意大小的平滑的作品。 在Scratch中，游戏中可玩的角色称为精灵。 绘图工具 Scratch的矢量绘图工具箱是您找到绘制对象所需工具的地方： 图片7.png 下面是一些与绘制矢量图形相关的词汇： 画布Canvas：你画的地方；白色和灰色的盘是透明的 节点Node：沿对象路径确定对象形状的点 图片9.png 3. 选择节点工具。单击对象的中心将其选中。您将看到四个节点均匀分布在圆的边缘。 图片10.png 移动任何节点都会改变圆的形状单击圆的边可以添加更多节点。 3. 使用箭头工具选择杆。要将茎移到苹果后面，请单击画布上方的“后退”按钮。 图片14.png 添加突出显示形状 1. 选择线条工具。在苹果形状上画一个三角形，把每一条新线和前一条线的末端连接起来。 3. 使用“节点”工具添加和调整节点以创建高光形状。如果节点过于尖锐，可以将其更改为曲线。选择要弯曲的节点，然后单击“弯曲”按钮。
7.4K00发布于 2019-11-10 - 来自专栏全栈开发工程师
【Uni-App社区小程序】005-引入自定义图标库
一、Iconfont-阿里巴巴矢量图标库 1、基本信息 简介 Iconfont-国内功能很强大且图标内容很丰富的矢量图标库,提供矢量图标下载、在线存储、格式转换等功能； 阿里巴巴体验团队倾力打造，设计和前端开发的便捷工具 第六步：解压压缩包后，得到如下文件 3、引入 第一步 ：将文件夹中的iconfont.css文件复制到我们的项目 第二步：删除一些不需要的内容，如图 （1）删除内容1 （2）启动自动换行功能 （3）删除内容 2 第三步：引入自定义图标库 第四步：使用图标 （1）打开pages下index目录下index.vue文件，删除一些不需要的代码，结果如： <template> <view> <view> <view class="iconfont icon-ziyuan1" style="font-size: 200rpx;"> </view> </view> </template> (3) 结果 （4）备注，图标对应的名字可打开下载的图标库解压后的文件夹中的demo_index.html文件查看
97810编辑于 2025-01-06 - 来自专栏数值分析与有限元编程
矢量函数
矢量函数的一般形式简单明了。在三维空间中的一个矢量函数是一个将每个点（x,y,z）和矢量对应的法则，例如流体的速度。指定一个函数v（x,y,z），它表明了流体的速度和在这一点的流动方向。 一般来说，一个矢量函数表明了在某个空间区域内每个点的大小和方向。可以利用许多箭头来描绘矢量函数的图像，如图1所示。在任一点处箭头的方向由矢量函数所确定，箭头长度和函数值大小成正比。 ? 如图2所示，和矢量一样，矢量函数也能分解为几个分量。 下面举一个矢量函数的例子： ? PS：本文将矢量加粗以示区别。
4.1K70发布于 2018-04-08 - 来自专栏站长的编程笔记
Layui 扩展字体图标
layui 目前（2020-06-28）提供了168个图标，但是很多时候这些图标中没有自己想要的，今天在项目中想找一个二维码的图标，但是在layui提供的图标中并没有，此时我们可以扩展图标（阿里巴巴矢量图标库 进入阿里巴巴矢量图标库官网，登陆账号 2. 下载图标 3. 三种使用方式 4. Font-class 使用示例 1. 进入阿里巴巴矢量图标库官网，登陆账号 ---- 阿里巴巴矢量图标库官网 https://www.iconfont.cn 任选一种方式登陆账号，必须登陆，否则无法进行下载 2. 下载图标 ---- 搜索想要的图标，滑过图标、加入购物车 点击 下载代码，得到一个zip压缩包 解压压缩包，得到一个文件夹 demo_index.html 示例文件，使用方法看该文件即可 3.
1.1K30编辑于 2023-02-18 - 来自专栏傲绝
阿里图标库引入图标
文章引入 比wordpress默认图表库的图标好看多的 默认图标库的图标一般都是灰白色简直难看死了哈哈 今天分享给大家如何插入阿里图标库的彩色图标 阿里图标库有什么好处呢 插入方便 图标样式多 彩色图标应有尽有 反正你用都用不完 重点还永久免费使用 引入方法 第一步：阿里巴巴矢量图标库官网 —> Github或者新浪微博登录 第二步：然后自己通过搜索框找到自己喜爱的图标并添加至购物车 —> 添加至项目 //没有项目的自己新建项目
3.7K30编辑于 2023-03-13 - 来自专栏hightopo
基于HT for Web矢量实现3D叶轮旋转
在上一篇《基于HT for Web矢量实现2D叶轮旋转》中讲述了叶轮旋转在2D上的应用，今天我们就来讲讲叶轮旋转在3D上的应用。 模型后，我们马上创建了一个3D图元，并将其添加到了dataModel容器中，这时我们需要一个3D拓扑来显示这个3D图元，具体的创建代码如下： var dataModel = new ht.DataModel (); var g3d = new ht.graph3d.Graph3dView(dataModel); g3d.setEye(200, 50, 300); g3d.setDashDisabled(false 到这里，模型就算完成了，接下来要做的就是让螺旋桨动起来，和2D叶轮旋转类似，在3D模型上也可以做数据绑定，要想让螺旋桨旋转起来，我们就需要设置螺旋桨的rotation属性，和3D上的图元不同的是，设置3D = new ht.graph3d.Graph3dView(dataModel); g3d.setEye(200, 50, 300); g3d.setDashDisabled
93340发布于 2018-07-09 - 来自专栏友人a的笔记丶
Ant-Design-Vue 3.x 图标库如何实现自动引入？
需求来源 Ant-Design-Vue升级到2.x以上的版本之后，自带的图标库就不支持通过给组件传递一个代表指定图标的属性来使用了。 1. 但是任何需求都不是绝对，总有不一样的需求，比如我； 实际测试，完整的图标库打包，经过Gzip压缩后只有130 kb+；完全可以接受 Tree Shaking Tree Shaking 指的就是当引入一个模块的时候 2.实现 首先引入@ant-design/icons-vue整个图标库，然后Jsx组件内，通过渲染函数直接渲染指定的图标；基础代码如下： <script> import {h} from 'vue' import h( $icon[props.icon], { style:{fontSize:"18px"} }); } } </script> 3. 拓展 @ant-design/icons-vue图标很全，但也有不够用的时候，这时候就可以考虑，让这个JSX组件兼容 iconfont图标了； 众所周知，阿里巴巴图标库一般都是统一class前缀，@ant-design
2.6K20编辑于 2023-02-17 - 来自专栏HT
基于HT for Web矢量实现3D叶轮旋转
在上一篇《基于HT for Web矢量实现2D叶轮旋转》中讲述了叶轮旋转在2D上的应用，今天我们就来讲讲叶轮旋转在3D上的应用。 模型后，我们马上创建了一个3D图元，并将其添加到了dataModel容器中，这时我们需要一个3D拓扑来显示这个3D图元，具体的创建代码如下： var dataModel = new ht.DataModel (); var g3d = new ht.graph3d.Graph3dView(dataModel); g3d.setEye(200, 50, 300); g3d.setDashDisabled(false 到这里，模型就算完成了，接下来要做的就是让螺旋桨动起来，和2D叶轮旋转类似，在3D模型上也可以做数据绑定，要想让螺旋桨旋转起来，我们就需要设置螺旋桨的rotation属性，和3D上的图元不同的是，设置3D = new ht.graph3d.Graph3dView(dataModel); g3d.setEye(200, 50, 300); g3d.setDashDisabled
1.2K60发布于 2018-01-03
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号