1 Star 0 Fork 12

开发团队 / easy-icon

forked from theajack / easy-icon 
加入 Gitee
与超过 1200万 开发者一起发现、参与优秀开源项目,私有仓库也完全免费 :)
免费加入
克隆/下载
README_CN.md 3.39 KB
一键复制 编辑 原始数据 按行查看 历史
theajack 提交于 2020-05-21 10:25 . feat: 修改图片

Easy-ICON

theajack

A Easy to Use Web Font ICON lib

在线使用 | English


[TOC]


1.Easy-ICON

Easy-ICON 是一个简单易用的icon字体库

Easy-ICON 使用 Font-Awesome 等多个图标库, 对原作者做出的贡献表示感谢!

  1. 使用非常简单
  2. 上千个常用的字体图标,包含多个字体图库
  3. 自定义任意css样式,缩放不模糊
  4. 按模块部分使用

2.安装使用

2.1 使用css文件引用:(推荐下载到本地然后引用本地文件)

easy-icon 共分为了五个模块,可以独立单独引用

<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/theajack/easy-icon/dist/easy-icon.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/theajack/easy-icon/dist/easy-icon-a.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/theajack/easy-icon/dist/easy-icon-f.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/theajack/easy-icon/dist/easy-icon-t.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/theajack/easy-icon/dist/easy-icon-l.css">

或者使用一个集合的版本

<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/theajack/easy-icon/dist/easy-icon-all.css">

2.2 或者使用npm安装:

npm i easy-icon;

您只需要引用一次即可:

与css文件引用一样,可以模块独立引用,无需使用全部

import 'easy-icon';
import 'easy-icon/easy-icon-a.js';
import 'easy-icon/easy-icon-f.js';
import 'easy-icon/easy-icon-t.js';
import 'easy-icon/easy-icon-l.js';

或者使用集合版本

import 'easy-icon/easy-icon-all.js';

2.3 使用

Easy ICON使用起来十分简单,您只需要在您想要使用的地方插入一个如下的标签即可:

<i class="ei-spmile"></i>

需要注意的是,五个模块对应的前缀不一样,分别为

  • easy-icon-a: ei-
  • easy-icon-a: ea-
  • easy-icon-f: ef-
  • easy-icon-t: et-
  • easy-icon-l: el-

查看可用的图标

Easy-ICON
展开全部图标 Easy-ICON Easy-ICON Easy-ICON Easy-ICON

3.其他

3.1 让图标旋转

您可以通过添加 ei-spin 类来使图标旋转:

<i class="ei-spinner-snake ei-spin"></i>

ei-spin 类对五个模块表现一致

3.2 选择尺寸

Easy ICON 内置了八种不同大小的尺寸,从小到大依次为::xs,s,l,lg,2x,3x,4x,5x

尺寸类对五个模块表现一致

<i class="ei-smile ei-s"></i>
<i class="ei-smile ei-xs"></i>

当然,您可以使用任何自定义css样式来覆盖默认的样式.

JavaScript
1
https://gitee.com/OAGroup/easy-icon.git
git@gitee.com:OAGroup/easy-icon.git
OAGroup
easy-icon
easy-icon
master

搜索帮助