先自我检讨一下下：之前在上家公司写MUI的时候，就用过自定义字体图标了，没有整理。到这家公司写ionic有用到了自定义字体图标，还是要去查一下再写，没有整理。现在都写vue了,elementUI也有自定义字体图标，关于字体图标我还是没有整理。真的是对自己无语了，懒死你了都！！！技术群里经常也有人问，一时半会儿也解释不清楚，所以趁着刚上班不太忙，先整理一下，免得又忘了/生无可恋脸！！！万变不离其宗，
转载
2024-07-28 20:01:18
259阅读
elementui 打包后图标加载偶尔会乱码preface错误现象猜想解决方案1. elementui 源码使用的是 node-sass2. 我本地的 是 dart-sass3. 查看了 打包后的css 文件4. 卸载 dart-sass5. 打包后的 css preface最近在 使用element UI 写项目， 项目在生产环境运行了一段时间后，页面刷新偶尔会出现 （搜索，箭头。。。）各种图
转载
2024-06-11 04:54:23
269阅读
1. elementUi 源码使用的是Node-sass,建议项目中也使用node-sass 检查page.json ,是否使用了 node-sass,如果使用了，建议删除，重新安装node-sass；安装时注意版本号。 2. 卸载 npm uninstall sass 3. 下载 node-sas ...
转载
2021-09-24 16:40:00
249阅读
2评论
软件版本"vue": "^2.6.14""electron": "^13.0.0"node v14.16.0"element-ui": "^2.15.8"问题描述
iconfont.cn站点的字体图标下载到本地，采用Font class的方式调用（如：<span class="icon iconfont icon-24gl-printer">），在开发预览环境中调用正常；可是打包后不显
转载
2024-07-30 14:42:00
250阅读
我们使用element-ui、vue开发网站的时候，往往图标是起着很重要的作用。 2018-11-9更新 1.傻瓜式引用：由于这种方法及其简单 省去了很多繁琐的步骤，a.引入项目生成的，图标地址。b.使用推荐使用这种，详情请看文档！！文档够详细的了。http://www.iconfont.cn/help/detail?spm=a313x.7781069.1998910419.d
转载
2024-05-01 08:04:02
246阅读
<i class="el-icon-s-grid" ></i> <template> <i class="el-icon-edit"></i> <i class="el-icon-share"></i> <i class="el-icon-delete"></i> <el-button type="
原创
2021-08-05 15:18:16
711阅读
Vue3+ElementPlus项目使用iconfont阿里图标1、封装通用组件2、引入iconfont3、使用（1）在main.js导入（2）在页面中使用4、有坑填坑 Element Plus中的图标其实也是组件，我们也知道在Vue中可以直接在模板中使用<svg>标签来插入SVG图标代码。这就给我们提供了一个思路，将阿里图标也封装成一个通用组件，然后在vu
有网友电脑开机发现桌面右下角的任务栏上面的小喇叭图标不见了，然后咨询学无忧小编小喇叭跑哪里去了，我们该怎么把小喇叭找回来呢。造成小喇叭不见的原因有很多，小编总结关于任务栏小喇叭图标不见了怎么办的几个原因及解决方法讲解给大家。1、首先小喇叭不见了，我们去查看电脑是否还有声音输出，如果声音有输出的话，那就好办了。直接打开你的“控制面板”，在上面找到“声音和视频设备-音量”，然后在窗口上把“将音量图标放
1、安装npm install element-ui --save-dev2、在main.js文件中引入import ElementUI from 'element-ui';import 'element-ui/lib/theme-chalk/index.css'; Vue.use(ElementUI);3、上面两步完成后，就可以在项目任意的组件中使用element-ui的组件了，具体使用方法，详
转载
2024-08-17 12:36:43
679阅读
解决vue-elementUI打包后icon图标偶尔乱码的问题一、背景二、现象三、原因四、处理方法方式1：使用css-unicode-loader方式2：升高 sass版本到1.39.0方式3：替换element-ui的样式文件方式4：更换打包压缩方式知识扩展：方式5：把sass更改为node-sass编译（不推荐） 一、背景本项目是若依作为开发框架（elemen-ui + vue + sass
转载
2024-06-17 04:55:05
1675阅读
前端自定义字体、iconfont，你学废了吗？ 文章目录前端自定义字体、iconfont，你学废了吗？一、自定义字体简介二、字体格式三、字体下载地址四、使用实例五、前端实现字体压缩六、字体加载七、web端使用iconfont自定义图标使用途径一：icon单个使用（不推荐）使用途径二：unicode引用（不推荐，主要原因：不支持多色图标，书写不直观，语意不明确）使用途径三：font-class引用（
通常我们电脑桌面图标都会按列排序，如果图标太多的话，就会有点乱，其实我们可以对图标进行分类分块进行管理，让桌面看起来更加简洁，那么win10桌面图标怎么进行分类分块管理呢？下面给大家带来详细的操作步骤吧。具体步骤如下：1、首先安装柠檬桌面，然后启动软件，在电脑桌面右击，可以发现菜单中多出几个该软件选项。第一次使用，点击一键整理，可以快速将图标进行归类，其中文档、文件夹等会收集到一起。2、使用过程中
1、标准的 CSS 的盒子模型？低版本 IE 的盒子模型有什么不同？（1）有两种， IE 盒子模型、W3C 盒子模型；（2）盒模型： 内容(content)、填充(padding)、边界(margin)、 边框(border)；（3）区 别： IE 的 content 部分把 border 和 padding 计算了进去;1.1remrem（font size of the root elemen
作者：TYANerelementUI是和vue配套的一个桌面端组件库。虽然是一个通用的组件库，但是由于使用场景的不同，我们可能会遇到一些小问题，以下是我个人的一、、总结。1、Tooptip文字提示tooltip使用时，必须有一个子元素（不能是文本元素）。2、修改主题色2.1 方案一：利用element UI的在线主题生成工具操作步骤：点击“切换主题色”，选择或输入色值。点击“下载主题”
转载
2024-03-25 10:34:58
415阅读
其实我们在工作中，很多时候ui给我们的图标可能就是从阿里图标库中拿来的 如果你用elemnt-ui写项目的时候 如果要用到很多图标 <el-button type="primary" icon="el-icon-search">搜索</el-button>
<i class="el-icon-edit"></i>
&l
转载
2024-03-01 07:07:46
515阅读
1 Vue练习1.1 练习：根据不同元素，展示不同的网址<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>练习vue路由</title>
<script src="vue/vue.js"></script>
<
转载
2024-10-12 19:25:12
143阅读
前面我在Vue中引用了Font Awesome字体图标，Font Awesome目前收入了675个图标（这些是可缩放的矢量图标,可以通过CSS样式来改变图标的大小、颜色、阴影或者其它任何支持的效果），相对element来说还算挺多的，今天我们再来使用一个图库更全的方案，那就是阿里提供的iconfont图标库，这个是目前国内最为强大的矢量图标库中心，里面含有非常丰富的矢量图标库提供下载。
defs
svg允许我们定义以后需要重复使用的图形元素。建议把所有需要再次使用的元素定义在defs元素里面。这样做可以增加svg内容的易读性和可访问性。在defs元素定义的元素不会直接呈现。你可以在你的视口的任意地方利用<use>元素呈现这些元素。
用法：
类别： 容器元素，结构元素
允许的内容物： 任意数量、任意排序的下列元素：动画元素、描述性元
一：引入单设图标1.打开 阿里icon，注册 >登录>图标管理>我的项目2.新建项目 返回阿里icon首页，点进去你想要的icon库，因为没有批量导入购物车，所以一般情况下需要一个一个去点，太浪费时间，那么请在控制台输入以下代码，批量导入var icons = document.querySelectorAll('.icon-gouwuche1');
var auto_clic
转载
2024-05-01 08:14:44
402阅读
项目优化上线1 项目优化1.1 项目优化策略生成打包报告第三方库启用CDNElement-UI组件按需加载路由懒加载首页内容定制1.2 实现进度条1.安装依赖2.导入包和样式在main.js中：3.在拦截器中进行进度条控制1.3 Build命令后移除所有console安装并配置Babel插件官网可以查看该插件的文档：babel-plugin-transform-remove-console安装插件
