新建项目第三步： 进入图标库--官方图标库 开始选择图标第四步：选中图标-- 添加入库-- 添加至项目---选择刚刚创建的项目--确定下面举例我们选择了两个图标 购物车中的图标 添加至项目第五步： 下载至本地---- 点击下载至本地按钮 下载至本地第六步： 解压下载的压缩文件----整理放入vue中的static中（在static中新建文件夹 icon ），同时直接把iconfont.css放入
转载
2020-07-01 09:59:00
275阅读
2评论
vue中iconfont的使用步骤1、进入iconfont官网（http://www.iconfont.cn），进入“官方图标”，选择你所需要的图标，加入购物车。2、进入“购物车”，将选择好的图标“添加至项目”，选择对应的项目，点击“确定”。3、在项目中，点击“下载至本地”，解压缩，文件目录如下：4、将字体文件及对应的iconfont.css文件复制到项目目录中，如...
原创
2021-08-27 12:37:37
346阅读
vue中iconfont的使用步骤1、进入iconfont官网（http://www.iconfont.cn），进入“官方图标”，选择你所需要的图标，加入购物车。2、进入“购物车”，将选择好的图标“添加至项目”，选择对应的项目，点击“确定”。3、在项目中，点击“下载至本地”，解压缩，文件目录如下：4、将字体文件及对应的iconfont.css文件复制到项目目录中，如...
原创
2022-01-11 13:59:36
299阅读
最近一直在更新Vue项目中配置及使用一些内置的方法，今天讲一讲Vue项目中使用iconfont图标库，不管是管理平台还是官网展示之类的显示页面，都会用到一些小图标，如果我们用img标签，那我们的资源库会非常的大，而且后期如果我们针对图标调整大小，改色等之类的操作，就需要用到Photoshop等专业类工具，上手困难不说，而且比较麻烦，下面就说下Vue使用iconfont图标库。1.配置iconfon
原创
2021-02-25 21:50:09
1130阅读
最近一直在更新Vue项目中配置及使用一些内置的方法，今天讲一讲Vue项目中使用iconfont图标库，不管是管理平台
原创
2022-06-01 13:45:51
1216阅读
第一步 下载之后解压第二步 引入到项目中在你的项目中引入iconfont.css文件第三步 使用
原创
2023-02-24 12:11:05
461阅读
如果是在标签内加icon  如果是使用class <i class='iconfont icon-wrong'></i> 如果是放在伪元素中使用： 需要将类名iconfont中的样式拿过来： .el-form-item__error::before { content: '\e70d
原创
2021-07-13 16:22:26
722阅读
layui的图标取自于阿里巴巴的矢量图标库 Iconfont，同样的，这篇教程也是基于Iconfont进行扩展。 第一步，通过浏览器打开 http://iconfont.cn/ ，访问阿里巴巴矢量图标库。 第二步，通过右上角的用户图标，授权登陆一个账号，在此我选择使用Github作为登陆账号。 第三
原创
2021-07-15 10:05:33
895阅读
一、什么是iconfont?我们现在通常所指的iconfont，是用字体文件取代图片文件，来展示图标、特殊字体等元素的方法。iconfont是阿里巴巴矢量图标库是由阿里巴巴体验团队倾力打造的中国第一个最大且功能最全的矢量图标库，提供矢量图标下载、在线存储、格式转换等功能，是设计师和前端开发的便捷工具。二、iconfont对于前端应用来说有很多便捷：1、自由变化大小，而且还具有更好的可维护性（因为是
iconfont使用说明： 1，下载对应的字体包 2，解压得到iconfont.css，在网页文件中引入iconfont.css 3，使用<i class="iconfont icon-sousuo"></i>显示字体，其中iconfont是固定类目， icon-sousuo是字体css名 ...
转载
2021-08-17 12:55:00
403阅读
2评论
Vue iconfont 编码转换<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Vue iconfont 编码转换</title> <link rel="stylesheet" href="./iconfont/iconfont.css"> <style> body { margin: 0; p
原创
2022-01-10 10:38:12
340阅读
1.进入iconfont官网，详情2.选中你喜欢的icon并加入购物车，然后添加进你的Iconfont文件夹下，最后下载到本地，就会有如下的一个包：上图中，我红色标记的这六个文件是需要的，其他的不需要，将其复制到你vue项目的static的iconfont文件夹下面,其中在main.js全局引入下iconfont。然后我们只需要看后缀名为css的那个文件，注意下面的class名称就是你要使用的cl
原创
2022-10-28 08:51:26
506阅读
在写页面的时候，不可避免需要用到好多小图标，可以让UI切图，但是这些切好的小图片在小屏手机上显示比较清晰，可能放到大屏上会有清晰度稍微下降的问题，这个问题可以用阿里巴巴矢量图标--iconfont来完美解决因为iconfont的图标是矢量的，不会出现变形和清晰度下降问题，而且后期操作性灵活，可以改图标的大小，颜色就像操作字体的属性一样方便，下面就开始介绍iconfont如何使用一、根据上面的网址进
转载
2024-08-14 21:55:53
404阅读
iconfont最基础使用 一、总结 一句话总结： 1、定义字体的方式（比如iconfont）？ 二、Iconfon
转载
2019-10-12 21:15:00
100阅读
2评论
这是宝宝的原文地址：http://blog.hanxuebaobao.com/?p=89 UniGui使用IconFont字体图标之前已经介绍过，UniGUi版本1.7.0.1500以后增加了Custom，使用第三方图标变得更简单了。 关于IconFont.cn的使用，请参考另一篇文章 选择完自己的
转载
2021-08-05 14:35:59
684阅读
为什么不切图标了以前的图标我们非常喜欢用ps等工具切成一张张xxx.png图片，如果稍微懂点移动端适配，对dpr(设备像素比)有所了解的，还会切出类似home@1x.ppng,home@2x.png,home@3x.png这样的图标，其中@1x表示用来适配dpr为1的手机，图像分辨率最低；@2x表示用来适配dpr为2的手机，图像分辨率稍高一些；@3x用来适配dpr为3的手机，图像分辨率最高。最后，
转载
2021-05-10 19:25:26
590阅读
2评论
