项目中,虽然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. [CodeForces-1036E] Covered Points 暴力 GCD 求交点

    题意: 在二维平面上给出n条不共线的线段,问这些线段总共覆盖到了多少个整数点 解法: 用GCD可求得一条线段覆盖了多少整数点,然后暴力枚举线段,求交点,对于相应的 整数交点,结果-1即可 #inclu ...

  2. Python3 图像边界识别

    # -*- coding: utf-8 -*- """ Created on Wed Mar 7 11:04:15 2018 @author: markli " ...

  3. Orleans部署

    一.配置指南 1,客户端配置 2,服务端配置 3,典型配置 4,配置.NET垃圾收集 5,SQL系统存储 二.监控 1,运行时监视 2,silo错误代码监测 3,客户端错误代码监测 三.解决部署问题 ...

  4. python 列表返回重复数据的下标

    class Solution(object): def searchRange(self, nums, target): """ :type nums: List[int ...

  5. c#操作数据库的增删改查语句及DataGridView简单使用

    下面是要用户名和密码连接数据库的操作: 一.定义连接字符串,用来链接SQL Server string str_con = "server=.(服务器名称一般为 . );database=W ...

  6. HDU3915 Game 高斯消元

    题目链接 HDU3915 Game 高斯消元 题解 求异或方程组自由元的子集个数 高斯消元求秩,内存溢出好神 代码 #include<bitset> #include<cstdio& ...

  7. BZOJ.4566.[HAOI2016]找相同字符(后缀数组 单调栈)

    题目链接 给定两个字符串,求它们有多少个相同子串.相同串的位置不同算多个. POJ3145简化版. 后缀自动机做法见这儿,又快又好写(一下就看出差距了..) //13712kb 4076ms #inc ...

  8. 潭州课堂25班:Ph201805201 爬虫基础 第十二课 点触验证码二 (课堂笔记)

    为上次代码添加 模拟人操作 的鼠标的移动轨迹 # -*- coding:utf-8 -*- # 斌彬电脑 # @Time : 2018/9/14 0014 上午 8:08 from selenium ...

  9. 潭州课堂25班:Ph201805201 第十一课 继承,多继承和魔术方法,属性和方法 (课堂笔记)

    继承: class p : cls_name = 'p' def __init__(self): print('正在实例化') def __del__(self): print('正在销毁') cla ...

  10. Xcode 清理存储空间

    Xcode版本:8.3.3 iOS版本:10.3.2 移除 Xcode 运行安装 APP 产生的缓存文件(DerivedData) 只要重新运行Xcode就一定会重新生成,而且会随着运行程序的增多,占 ...