项目中,虽然layui的字体图标库中已经有了1000多个图标了,但是也有时候不能满足我们自定义图标的需求,所以需要进行自定义,具体步骤如下:

1.在iconfont上找到自己喜欢的图标,也可以上传ui做好的图标,做自己喜欢的图标,加入购物车后导出字体图标;

2.打开icoMoon网站,将自己导出的图标中的svg文件和layui中的svg文件一起导入,然后selectAll。

3.generate字体.

4.将生成的字体图标里面的style.css引入页面,然后使用;

扩展layui中的自带字体图标的更多相关文章

  1. Awesome图标 | 如何在某些编辑软件中使用Font Awesome字体图标

    文章目录 Font Awesome 字体图标 在某些编辑软件中使用 Font Awesome 字体图标 Font Awesome 为您提供可缩放矢量图标,它可以被定制大小.颜色.阴影以及任何可以用 C ...

  2. MVC.NET 发布后,部署到iis ,网站中的Bootstrap的字体图标不能正常显示

    时隔多日没有在博客中记录自己遇到的问题及解决方案了 ,今天给大家分享一个可能会遇到的一个鸡肋bug ! 如果你的项目是MVC并且在项目中引用了 Boostrap 框架,你在编辑发布后部署到iis的时候 ...

  3. 在nuxt中引入Font Awesome字体图标库

    介绍 在element-ui框架中提供了一些图标样式,但是种类比较少,所以在这里提供一套更完善的字体图标库Font Awesome(官方文档),下面就开始介绍如何在一个nuxt项目中使用这套字体库. ...

  4. react-native中使用自定义的字体图标iconfont

    iconfont图标库下载 可在 http://www.iconfont.cn 下载 下载完成后的目录中有字体文件: iconfont.ttf 拷贝字体文件 Android: 在 Android/ap ...

  5. Winfrom中如何使用Iconfont字体图标补充

    1.参考技术文章:http://www.cnblogs.com/isaboy/p/csharp_Font_Awesome_window_form_icon.html 2.参考后主要纠结在图标的unic ...

  6. 认识CSS中字体图标

    前端之HTML,CSS(十一) 字体图标 使用文字做出小图标的效果并超越了小图标应用精灵图,使得图标变得灵活,减少了请求次数,优化了界面的性能.字体图标本身为矢量图. 字体图标的使用过程 1.UI设计 ...

  7. WPF自定义控件与样式(1)-矢量字体图标(iconfont)

    一.图标字体 图标字体在网页开发上运用非常广泛,具体可以网络搜索了解,网页上的运用有很多例子,如Bootstrap.但在C/S程序中使用还不多,字体图标其实就是把矢量图形打包到字体文件里,就像使用一般 ...

  8. 007:CSS字体图标

    目录 理论 一:字体图标 图片是有诸多优点的,但是缺点很明显,比如图片不但增加了总文件的大小,还增加了很多额外的"http请求",这都会大大降低网页的性能的.更重要的是图片不能很好 ...

  9. layui 自定义字体图标 扩展

    layui的图标取自于阿里巴巴的矢量图标库 Iconfont,同样的,这篇教程也是基于Iconfont进行扩展. 第一步,通过浏览器打开 http://iconfont.cn/ ,访问阿里巴巴矢量图标 ...

随机推荐

  1. 论文笔记-Mining latent relations in peer-production environments

    背景 用户合作产生内容的网站越来越多,有许多隐藏的信息可以去挖掘 wiki上保存了贡献者的编辑记录,提供了非常多的有用的信息 研究发现,大部分的贡献者仅仅会参与编辑很小数量的文章,修改的版本也有限制, ...

  2. 2852 ACM 杭电 KiKi's K-Number 0 1 2

    题目:http://acm.hdu.edu.cn/showproblem.php?pid=2852 题意:三种操作: 0 插入 1 删除 2 查找比a大的第k个数. 思路:看了大神都是用树状数组写的, ...

  3. C中const 定义常量的使用

    先看如下代码 #include <stdio.h> #include <string.h> #define ARRSIZE(a) (sizeof(a)/sizeof(a[0]) ...

  4. Java基础-多线程-②多线程安全问题

    什么是线程的安全问题? 上一篇 Java基础-多线程-①线程的创建和启动 我们说使用实现Runnable接口的方式来创建线程,可以实现多个线程共享资源: class Dog implements Ru ...

  5. Oozie分布式工作流——Action节点

    前篇讲述了下什么是流控制节点,本篇继续来说一下什么是 Action Nodes操作节点.Action节点有一些比较通用的特性: Action节点是远程的 所有oozie创建的计算和处理任务都是异步的, ...

  6. .net 企业管理系统快速搭建框架

          简言   本人在博客园注册也2年多了,一直没有写自己的博客,因为才疏学浅一直跟着园子里的大哥们学习这.net技术.一年之前跳槽到现在的公司工作,由于公司没有自己一套的开发框架,每次都要重新 ...

  7. 更优雅地关闭资源 - try-with-resource及其异常抑制

    原文:https://www.cnblogs.com/itZhy/p/7636615.html 一.背景 我们知道,在Java编程过程中,如果打开了外部资源(文件.数据库连接.网络连接等),我们必须在 ...

  8. SharePoint 特殊用户标识

    To get claim for All Authenticated Users in PS you need to use:$claim = New-SPClaimsPrincipal -Encod ...

  9. JSON数据之使用Fastjson进行解析(一)

    据说FastJson是目前最快的解析Json数据的库,而且是国人开发出来的开源库.顶一下,付上官方网址:http://code.alibabatech.com/wiki/pages/viewpage. ...

  10. 5、Python文件类型

    Python文件类型 源代码 Python源代码的文件以"py"为扩展名,由Python程序解释,不需要编译 字节代码 Python源文件经编译后生成的扩展名为"pyc& ...