项目中，虽然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. Python 函数装饰器

    首次接触到装饰器的概念,太菜啦! Python 装饰器可以大大节省代码的编写量,提升代码的重复使用率.函数装饰器其本质也是一个函数,我们可以把它理解为函数中定义了一个子函数. 例如我们有这么一个需求, ...

  2. [软件研究]对wdcp v3的一次小研究#1

    0x00 前言 好久没有更新了,已经长草无疑. 之前团队要搞个测验的系统,用来安全培训考核,团队内又没啥人搞开发的,自己又想学一下vue,就用vue+ci 撸了一个. 搞了一个星期基本搞完(开发能力真 ...

  3. Mac电脑 阿里云ECS（ContentOS） Apache+vsftpd+nodejs+mongodb建站过程总结

    简介:我这里采用的阿里云免费提供的6个月ECS服务器:制作了一个简单的爬虫程序:里面很多功能还么做:搜索里面功能回去的数据未做处理会崩溃(大家不要点搜索功能):地址:http://loldragon. ...

  4. 一个新的Android Studio 2.3.3可以在稳定的频道中使用。A new Android Studio 2.3.3 is available in the stable channel.

    作者:韩梦飞沙 Author:han_meng_fei_sha 邮箱:313134555@qq.com E-mail: 313134555 @qq.com 一个新的Android Studio 2.3 ...

  5. BZOJ.3620.似乎在梦中见过的样子(KMP)

    题目链接 /* 896kb 6816ms A+B+A是KMP的形式,于是固定左端点,对于每个位置i,若fail[i]所能到的点k中(k=fail[fail[fail[...]]]),有满足len(l~ ...

  6. [HDU5361]In Touch

    [HDU5361]In Touch 题目大意: 有\(n(n\le2\times10^5)\)个点,每个点有三个属性\(l_i,r_i,c_i\).表示若\(|i-j|\in[l_i,r_i]\),\ ...

  7. 在linux上安装tomcat

    (1)主要参考https://jingyan.baidu.com/article/3065b3b6e0fad2becff8a419.html(这个看后基本知道怎么安装tomcat) 其次参考:http ...

  8. JUnit pass/failure/error区别

    pass:被测程序没有抛出异常,得到的是预期的值. failure:被测程序的逻辑有错误,得不到预期的值.执行了JUnit的断言. error:被测程序本身抛出异常,还没有执行到JUnit的断言就抛出 ...

  9. FTP和TCP的文件传输效率对比测试分析

    前言 最近因项目需要,需要把一定数量的中等文件从开发板上传到电脑上,分别选择了FTP和TCP自定义协议两种方式进行传输,进行了简单的对比测试,故做如下记录. 测试环境 开发板:Linux,ARMv7 ...

  10. Java虚拟机的最大内存是多少

    天分析了当前比较流行的几个不同公司不同版本JVM的最大内存,得出来的结果如下: 公司 JVM版本 最大内存(兆)client 最大内存(兆)server SUN 1.5.x 1492 1520 SUN ...