一、制作:IcoMoon

这个教程一搜一大把,是很方便快捷的一种方式,提供上传、编辑或者选择IcoMoon-Free下载可以直接拿来用了。 
网址:https://icomoon.io/app/

上传需要制作成iconfont的svg图片,点击import iconts--generate font--download

二、使用方法

使用步骤如下:

第一步:引入项目下面生成的fontclass代码:

<link rel="stylesheet" type="text/css" href="./iconfont.css">

第二步:在fonts文件夹引入font字体文件

例如icomoon.ttf

第三步:挑选相应图标并获取类名,应用于页面:

<i class="iconfont icon-xxx"></i>

IconFont 图标制作和使用的更多相关文章

  1. 00字体图标iconfont的制作与使用--阿里矢量图库

    一.iconfont的使用范围 在工作当中,经常会用到嵌在元素里的小图标 在这种情况下,如果使用<img>标签或者用作背景图片,也能实现这种效果.但是如果这么做的话,就必须把图片一个个切下 ...

  2. icon-font图标介绍

    前言 像素完美(Pixel Perfection).分辨率无关(Resolution Independent)和多平台体验一致性是设计师们的追求. 可访问性(Accessability).加载性能和重 ...

  3. 自定义iconfont 图标库下载本地在移动App的使用及svg彩色图标

    自定义iconfont 图标库扩展 在Hbuilder开发移动App的使用及svg彩色图标(或mui图标库的自定义扩展) 前提准备:1.登录阿里iconfont图标库,创建自己的项目,地址:http: ...

  4. 如何引入iconfont图标与Element-UI组件

    一.iconfont图标 iconfont方便又好用,介绍一下如何在vue项目中引入iconfont 1.进入iconfont官网 www.iconfont.cn 2.登录自己账户 3.选择图标后下载 ...

  5. 使用iconfont图标

    iconfont.cn基本使用 登录iconfont.cn网站,直接使用github账号即可登录 输入关键字搜索需要的图标,然后在需要的图标上点击'添加入库' 点击网站右上角的购物车图标,查看当前已入 ...

  6. veu——引入iconfont图标

    我这里是阿里的iconfont图标,如何下载请看下面这个博文 https://www.cnblogs.com/wangyang0210/articles/9248324.html 创建文件夹 在ass ...

  7. 在线图标制作,格式转换 ICON

    在线图标制作,格式转换 https://www.easyicon.net/covert/

  8. vue项目中使用阿里iconfont图标

    在上一篇文章中介绍了如何在vue项目中使用vue-awesome,如果你想了解,请移步<vue项目中使用vue-awesome> 这里介绍一下vue项目中如何使用阿里的iconfont图标 ...

  9. JMeter快捷键图标制作 去掉cmd命令窗口

    使用jmeter时: 如果使用默认的jmeter.bat启动的话,会出现一个CMD命令窗口之后再会启动jmeter工作界面 直接启用ApacheJMeter.jar文件即可跳过CMD命令窗口启动jme ...

随机推荐

  1. 《剑指offer》 大数递增

    本题来自<剑指offer> 大数的存储 题目: 针对以下问题:大数的存储.大数的相加.大数的运算. 思路: 当数据较大时候,long long数据已经存储不了,借助数组的方式进行存储. 假 ...

  2. BrupSuite渗透测试笔记(十)

    一.Brup Repeater通常结合Proxy(历史记录),Scanner(扫描记录).Target(站点地图)等,通过其他工具上的右键执行[Send to Repeater],之后跳转到Repea ...

  3. python(8):面向对象编程

    有三种程序类型: (1)面向过程:按照一定的逻辑顺序,一步步垒代码 (2)面向函数:对用常用的计算,建立函数避免重复 (3)面向对象: 函数的集合,对函数进行分类和封装 (一) 抽象 抽象: 哈巴狗, ...

  4. mysql入门练习

    2.详细解释列mysql执行语句的每个参数与参数值的含义 ​ mysql -hlocalhost -P3306 -uroot -proot 连接数据库,端口号为3306, 用户名root, 密码roo ...

  5. Springboot+MyBatis+JPA集成

      1.前言 Springboot最近可谓是非常的火,本人也在项目中尝到了甜头.之前一直使用Springboot+JPA,用了一段时间发现JPA不是太灵活,也有可能是我不精通JPA,总之为了多学学Sp ...

  6. java数组元素的复制

    package day03; import java.util.Arrays; /** * * 数组元素的复制: int的默认值是0,boolean默认值是flase 数组的扩容和缩容(本质的实现数组 ...

  7. Oracle查询CLOB字段类型的内容

    select dbms_lob.substr(lo.ldtext) as text from longdescription lo

  8. Django-model聚合查询与分组查询

    Django-model聚合查询与分组查询 聚合函数包含:SUM AVG MIN MAX COUNT 聚合函数可以单独使用,不一定要和分组配合使用:不过聚合函数一般和group by 搭配使用 agg ...

  9. 494. Target Sum

    You are given a list of non-negative integers, a1, a2, ..., an, and a target, S. Now you have 2 symb ...

  10. rsa证书ssh登陆服务器

    好久不用,又生疏了. 今晚实操了一下,作一个记录. 使用rsa的密钥对登陆linux服务器,主要是为了安全. 这种证书级别的登陆,比最复杂的root用户名和帐号的安全性都要高一个等级. 至少服务器不会 ...