• 复制
    
  • 计算列
    
  • 范围分组列
    
  • 枚举分组列
    
  • 公共
    
  • 扫码
    
  • 升序
    
  • 降序
    
  • 时间
    
  • 日期
    
  • 关闭
    
  • 撤销
    
  • 分组
    
  • 数据表单
    
  • 已锁定
    
  • 未锁定
    
  • 验证码
    
  • 分割线
    
  • 合并单元格
    
  • 取消合并
    
  • 24gl-borderAll
    
  • 
    24gl-borderBottom
    
  • 24gl-borderInside
    
  • 24gl-borderOutside
    
  • 24gl-borderTop
    
  • 24gl-borderNone
    
  • 24gl-borderInsideRow
    
  • 24gl-borderLeft
    
  • 24gl-borderRight
    
  • 24gl-borderInsideCol
    
  • 附件
    
  • 启用
    
  • 中断
    
  • 󦕢
    未开始
    󦕢
  • 表格边框设置
    
  • 取消合并单元格
    
  • 拆分单元格
    
  • 合并单元格
    
  • 电子签名
    
  • 预览 (1)
    
  • 图片
    
  • 分割线
    
  • 表格
    
  • 启用
    
  • 表单
    
  • 眼睛3
    
  • 眼睛1
    
  • 新建文件夹
    
  • 取消-cancel
    
  • 收到的分享
    
  • 我的发布
    
  • 我的权限
    
  • 我的分享
    
  • 我的收藏
    
  • 最近访问
    
  • 用户
    
  • 
  • 取消分享
    
  • 重发
    
  • 置顶
    
  • 模型
    
  • 用户参数
    
  • xinjianduliang
    
  • 断开链接
    
  • 叹号
    
  • 模块
    
  • 表格
    
  • 关闭任务_操作_jurassic
    
  • 删除多个文件
    
  • 日志
    
  • 𐂻
    查看搜索
    𐂻
  • 删除数据
    
  • 复制
    
  • 移动
    
  • 执行任务
    
  • 日期
    
  • 时间
    
  • 列表
    
  • 模型树
    
  • 转储凭证
    
  • 文件文档
    
  • 刷新-F
    
  • 禁止父项的继承权限传播到对象
    
  • 关闭 (3)
    
  • 月日
    
  • 指标
    
  • 资源授权
    
  • 操作权限
    
  • 文件夹对
    
  • 移除
    
  • 新建组
    
  • user-plus-light
    
  • 用户角色
    
  • 关联资源
    
  • 地理位置
    
  • 时间标记
    
  • 编辑
    
  • 平板
    
  • 资源发布
    
  • MBE风格多色图标-艺术
    
  • 文字
    
  • 悬停提示
    
  • 还原
    
  • 是否显示1
    
  • 更多
    
  • 最大化
    
  • 筛选
    
  • 查看筛选条件
    
  • 组件切换
    
  • 移动
    
  • 浮动
    
  • SQL
    
  • 替换
    
  • 字体颜色_文字操作_jurassic
    
  • 下划线
    
  • 云上传
    
  • 主题
    
  • 替换数据源来源
    
  • 联动设置
    
  • quxiaozhuanhuan
    
  • 转换
    
  • 等比缩放高度铺满
    
  • 全屏铺满
    
  • 等比缩放宽度铺满
    
  • 不刷新
    
  • 操作
    
  • 画布缩放到最佳位置
    
  • 画布还原至100%
    
  • 鹰眼功能
    
  • 还原
    
  • gengduo
    
  • hangbiao1
    
  • 列表
    
  • 仪表盘标记
    
  • 仪表盘筛选
    
  • 箭头
    
  • 右对齐
    
  • 左对齐
    
  • 左右对齐
    
  • 加号
    
  • 添加子项
    
  • 参数0
    
  • 公共设置
    
  • 左括号
    
  • 右括号
    
  • 斜杠
    
  • *
    
  • 表关系
    
  • me_首页
    
  • 执行
    
  • 播放
    
  • 任务执行
    
  • 抽取并建宽表
    
  • 错误
    
  • 增加
    
  • 减号
    
  • 等于
    
  • 语法
    
  • fuzhizhuanduliang
    
  • 查看密码
    
  • 眼睛-闭
    
  • 删除
    
  • 度量
    
  • 上下拖动
    
  • 选择
    
  • 复制转度量
    
  • 维度值图标
    
  • 抽取计划
    
  • 抽取日志
    
  • 关闭
    
  • 
    即席查询
    
  • jinzhi-zidonghuancun
    
  • bu-jiance
    
  • 检测
    
  • 系统配置
    
  • 自动缓存
    
  • 所有表
    
  • 添加
    
  • 系统参数
    
  • 减少
    
  • 填报
    
  • 预览数据
    
  • 校验
    
  • 检测关系
    
  • 移动端-感叹号
    
  • 分析报表
    
  • 分析
    
  • 模型
    
  • 密码可见
    
  • 密码不可见
    
  • 复制
    
  • 删除1
    
  • 行为分析
    
  • 指标模型
    
  • 维度
    
  • 指标
    
  • 事实表
    
  • 度量
    
  • 树选择
    
  • 水平布局
    
  • 多选
    
  • 密码
    
  • 下拉
    
  • 单选
    
  • 文字
    
  • 富文本
    
  • 级联
    
  • 单行输入
    
  • 步骤条
    
  • 垂直布局
    
  • 开关
    
  • 多行输入
    
  • 手机
    
  • 电脑
    
  • 数据集
    
  • 检查依赖
    
  • Foreach循环器
    
  • 检查文件存在
    
  • 检查字段值
    
  • 查看历史里面放图标
    
  • 学校
    
  • 双箭头1
    
  • 双箭头-下
    
  • 文件夹(关闭)
    
  • 文件夹(打开)
    
  • 刷新
    
  • 还原
    
  • 7撤销
    
  • 放大
    
  • 缩小
    
  • 原始大小
    
  • 查看日志
    
  • 固定
    
  • ETL自动化
    
  • 工作流
    
  • 类型ETL
    
  • 合并行
    
  • 多表JOIN
    
  • 行转列
    
  • 列转行
    
  • 合并列
    
  • 聚合
    
  • 组合查询
    
  • JOIN
    
  • 元数据编辑
    
  • 派生列
    
  • 拆分列
    
  • 日期时间
    
  • 列选择
    
  • 行选择
    
  • 值替换
    
  • 28-插入行
    
  • 替换
    
  • 空值处理
    
  • daochuExcelmoban
    
  • 去除重复值
    
  • 增加序列号
    
  • 过滤
    
  • 排序
    
  • 数据清洗
    
  • 关系目标表
    
  • 导出数据大屏HDFS
    
  • Kafka数据源
    
  • excel文件
    
  • 示例数据源
    
  • FTP数据源
    
  • 数据集
    
  • 文本数据源
    
  • KHCFDC_文本
    
  • 关系数据源
    
  • icon_file_19
    
  • 󦕡
    读取excel sheet
    󦕡
  • 下载
    
  • 问号
    
  • 缓存
    
  • 执行策略
    
  • icon-test79
    
  • 策略
    
  • 定时任务
    
  • 查看详情
    
  • 模型管理
    
  • 过滤
    
  • 计算器
    
  • 脱敏规则
    
  • 编组 28
    
  • 3.1收藏-选中
    
  • tuozai-jiantou
    
  • youjiantou3
    
  • youjiantou2
    
  • 右箭头
    
  • 左箭头
    
  • a-28Etuodong
    
  • 
  • 左箭头
    
  • 右箭头
    
  • 上一页
    
  • 下一页
    
  • 标识类_联动API
    
  • 设置
    
  • 切换图表
    
  • 统计管理
    
  • 打印
    
  • 视图模式
    
  • 保存
    
  • 16过滤
    
  • 基础参数
    
  • 收藏
    
  • 导出文件
    
  • 另存
    
  • 字段设置
    
  • 文档下载
    
  • cps_zht_nav_icon05ddyj
    
  • 提交成功
    
  • 禁止
    
  • 卒中筛查
    
  • 清空
    
  • 图表-函数
    
  • 立即报名001
    
  • 编辑
    
  • 删除
    
  • 人员
    
  • 教师_班级
    
  • 团队展示
    
  • 个人
    
  • 定位到图
    
  • 列表
    
  • 文件列表2
    
  • ic_文件夹2
    
  • 表单定制(模版)
    
  • 数据库
    
  • 对勾
    
  • shangyi
    
  • shang
    
  • xia
    
  • xiayi
    
  • 关闭
    
  • 刷新
    
  • 文档时间
    
  • 筛选
    
  • 放大镜
    
  • 添加
    
  • 上传文件夹-01
    
  • 刷新
    
  • 新建_数据sql文件
    
  • 点击-click
    
  • 复制
    
  • 导入
    
  • 导出2
    
  • 删除
    
  • 检测-16px
    
  • 手机
    
  • 下箭头
    
  • 上箭头
    
  • 右箭头
    
  • 
  • 指标管理
    
  • 系统管理
    
  • 文件-文件类别
    
  • 筛选
    
  • 数据库连接
    
  • 加号-12
    
  • 学校
    
  • 电脑
    
  • 压缩文件
    
  • 创建路由
    
  • 时间
    
  • 行转列
    
  • SQL升级文件
    
  • icon_SQL
    
  • 脱敏_1
    
  • 表输入
    
  • excel输入
    
  • excel输出
    
  • 表输出
    
  • 加密
    
  • 构建表达式
    
  • 主题,皮肤
    
  • 转换
    
  • 
  • 叹号
    
  • g箭头s
    
  • 开始
    
  • 属性
    
  • 任务
    
  • 参数设置
    
  • 备注
    
  • 撤销
    
  • 重做
    
  • 操作-监听记录
    
  • 操作-监听报告
    
  • 任务管理
    
  • 检查
    
  • 任务流程
    
  • 变量赋值
    
  • 草稿箱
    
  • SQL语言
    
  • JavaCore分析
    
  • SHELL
    
  • 布局-02
    
  • 任务管理
    
  • 异常 (4)
    
  • email
    
  • 箭头
    
  • 维修申请单
    
  • 教务处
    
  • 电脑
    
  • 配比数据库
    
  • 货物堆
    
  • 开始填报
    
  • 维修情况
    
  • 维修类别-01
    
  • 
    分析
    
  • publish-two发送2
    

Unicode 引用


Unicode 是字体在网页端最原始的应用方式,特点是:

  • 支持按字体的方式去动态调整图标大小,颜色等等。
  • 默认情况下不支持多色,直接添加多色图标会自动去色。

注意:新版 iconfont 支持两种方式引用多色图标:SVG symbol 引用方式和彩色字体图标模式。(使用彩色字体图标需要在「编辑项目」中开启「彩色」选项后并重新生成。)

Unicode 使用步骤如下:

第一步:拷贝项目下面生成的 @font-face

@font-face {
  font-family: 'iconfont';
  src: url('iconfont.woff2?t=1709363149951') format('woff2'),
       url('iconfont.woff?t=1709363149951') format('woff'),
       url('iconfont.ttf?t=1709363149951') format('truetype');
}

第二步:定义使用 iconfont 的样式

.iconfont {
  font-family: "iconfont" !important;
  font-size: 16px;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

第三步:挑选相应图标并获取字体编码,应用于页面

<span class="iconfont">&#x33;</span>

"iconfont" 是你项目下的 font-family。可以通过编辑项目查看,默认是 "iconfont"。

  • 复制
    .icon-fuzhi3
  • 计算列
    .icon-jisuanlie
  • 范围分组列
    .icon-fanweifenzulie
  • 枚举分组列
    .icon-meijufenzulie
  • 公共
    .icon-gonggong
  • 扫码
    .icon-saoma
  • 升序
    .icon-shengxu
  • 降序
    .icon-jiangxu
  • 时间
    .icon-shijian2
  • 日期
    .icon-riqi1
  • 关闭
    .icon-guanbi2
  • 撤销
    .icon-chexiao1
  • 分组
    .icon-fenzu
  • 数据表单
    .icon-shujubiaodan
  • 已锁定
    .icon-unlocked
  • 未锁定
    .icon-weisuoding
  • 验证码
    .icon-yanzhengma
  • 分割线
    .icon-fengexian1
  • 合并单元格
    .icon-hebingdanyuange1
  • 取消合并
    .icon-quxiaohebing
  • 24gl-borderAll
    .icon-24gl-borderAll
  • 24gl-borderBottom
    .icon-24gl-borderBottom
  • 24gl-borderInside
    .icon-24gl-borderInside
  • 24gl-borderOutside
    .icon-24gl-borderOutside
  • 24gl-borderTop
    .icon-24gl-borderTop
  • 24gl-borderNone
    .icon-24gl-borderNone
  • 24gl-borderInsideRow
    .icon-24gl-borderInsideRow
  • 24gl-borderLeft
    .icon-24gl-borderLeft
  • 24gl-borderRight
    .icon-24gl-borderRight
  • 24gl-borderInsideCol
    .icon-24gl-borderInsideCol
  • 附件
    .icon-fujian2
  • 启用
    .icon-qiyong
  • 中断
    .icon-duankai
  • 未开始
    .icon-jian1-copy
  • 表格边框设置
    .icon-biaogebiankuangshezhi
  • 取消合并单元格
    .icon-quxiaohebingdanyuange
  • 拆分单元格
    .icon-chaifendanyuange
  • 合并单元格
    .icon-hebingdanyuange
  • 电子签名
    .icon-dianziqianming
  • 预览 (1)
    .icon-a-yulan1
  • 图片
    .icon-tupian
  • 分割线
    .icon-fengexian
  • 表格
    .icon-biaoge1
  • 启用
    .icon-icon_list_qiyong
  • 表单
    .icon-biaodan
  • 眼睛3
    .icon-yanjing
  • 眼睛1
    .icon-yanjing2
  • 新建文件夹
    .icon-xinjianwenjianjia
  • 取消-cancel
    .icon-quxiao-cancel
  • 收到的分享
    .icon-shoudaodefenxiang
  • 我的发布
    .icon-wodefabu
  • 我的权限
    .icon-wodequanxian
  • 我的分享
    .icon-wodefenxiang
  • 我的收藏
    .icon-wodeshoucang
  • 最近访问
    .icon-zuijinfangwen
  • 用户
    .icon-yonghu
  • .icon-pen-fill
  • 取消分享
    .icon-quxiaofenxiang
  • 重发
    .icon-chongfa
  • 置顶
    .icon-zhiding
  • 模型
    .icon-moxing
  • 用户参数
    .icon-yonghucanshu
  • xinjianduliang
    .icon-xinjianduliang
  • 断开链接
    .icon-xialingyingicon-50
  • 叹号
    .icon-tanhao
  • 模块
    .icon-mokuai
  • 表格
    .icon-biaoge
  • 关闭任务_操作_jurassic
    .icon-jurassic_close-task
  • 删除多个文件
    .icon-a-kuozhanicon_huaban1fuben31
  • 日志
    .icon-rizhi1
  • 查看搜索
    .icon-chakansousuo
  • 删除数据
    .icon-database_delete
  • 复制
    .icon-fuzhi2
  • 移动
    .icon-yidong
  • 执行任务
    .icon-zhixingrenwu
  • 日期
    .icon-riqi
  • 时间
    .icon-shijian1
  • 列表
    .icon-liebiao2
  • 模型树
    .icon-tree
  • 转储凭证
    .icon-zhuanchupingzheng
  • 文件文档
    .icon-wenjianwendang
  • 刷新-F
    .icon-shuaxin-F
  • 禁止父项的继承权限传播到对象
    .icon-jinzhifuxiang
  • 关闭 (3)
    .icon-a-guanbi3
  • 月日
    .icon-yueri
  • 指标
    .icon-yewuzhibiao
  • 资源授权
    .icon-ziyuanshouquan
  • 操作权限
    .icon-caozuoquanxian
  • 文件夹对
    .icon-icon_wenjianjiadui
  • 移除
    .icon-yichu
  • 新建组
    .icon-xinjianzu
  • user-plus-light
    .icon-user-plus-light
  • 用户角色
    .icon-yonghujuese
  • 关联资源
    .icon-icon_list_guanlianziyuan
  • 地理位置
    .icon-appoffline
  • 时间标记
    .icon-shijianbiaoji
  • 编辑
    .icon-bianji-25
  • 平板
    .icon-pingban-view-h
  • 资源发布
    .icon-ziyuanfabu
  • MBE风格多色图标-艺术
    .icon-MBEfenggeduosetubiao-yishu
  • 文字
    .icon-wenzi
  • 悬停提示
    .icon-xuantingtishi
  • 还原
    .icon-restore
  • 是否显示1
    .icon-xianshikejian
  • 更多
    .icon-gengduo1
  • 最大化
    .icon-zuidahua
  • 筛选
    .icon-shaixuan4
  • 查看筛选条件
    .icon-shaixuan3
  • 组件切换
    .icon-qiehuantubiao1
  • 移动
    .icon-weizhiyidong
  • 浮动
    .icon-fudong
  • SQL
    .icon-SQL
  • 替换
    .icon-tihuan1
  • 字体颜色_文字操作_jurassic
    .icon-jurassic_font-color
  • 下划线
    .icon-shanchuxian
  • 云上传
    .icon-yunshangchuan
  • 主题
    .icon-t-shirt-fill
  • 替换数据源来源
    .icon-tihuantupian
  • 联动设置
    .icon-liandong
  • quxiaozhuanhuan
    .icon-quxiaozhuanhuan
  • 转换
    .icon-zhuanhuan1
  • 等比缩放高度铺满
    .icon-dengbisuofanggaodupuman
  • 全屏铺满
    .icon-quanpingpuman
  • 等比缩放宽度铺满
    .icon-dengbisuofangkuandupuman
  • 不刷新
    .icon-jinzhishuaxin
  • 操作
    .icon-caozuo
  • 画布缩放到最佳位置
    .icon-zuijiaweiz
  • 画布还原至100%
    .icon-xuxian
  • 鹰眼功能
    .icon-yingyan
  • 还原
    .icon-huanyuan
  • gengduo
    .icon-gengduo
  • hangbiao1
    .icon-hangbiao1
  • 列表
    .icon-liebiao1
  • 仪表盘标记
    .icon-biaoji
  • 仪表盘筛选
    .icon-shaixuan2
  • 箭头
    .icon-jiantou11
  • 右对齐
    .icon-youduiqi
  • 左对齐
    .icon-zuoduiqi
  • 左右对齐
    .icon-zuoyouduiqi
  • 加号
    .icon-jiahao
  • 添加子项
    .icon-tianjiazixiang
  • 参数0
    .icon-canshu1
  • 公共设置
    .icon-icon-setting-global
  • 左括号
    .icon-zuokuohao
  • 右括号
    .icon-youkuohao
  • 斜杠
    .icon-yihangyige
  • *
    .icon-a-
  • 表关系
    .icon-biaohuanxi01
  • me_首页
    .icon-me_shouye
  • 执行
    .icon-zhihang
  • 播放
    .icon-bofang
  • 任务执行
    .icon-renwuzhixing
  • 抽取并建宽表
    .icon-chouqubingjiankuanbiao
  • 错误
    .icon-cuowu
  • 增加
    .icon-zengjia
  • 减号
    .icon-jianhao
  • 等于
    .icon-dengyu
  • 语法
    .icon-yufa
  • fuzhizhuanduliang
    .icon-fuzhizhuanduliang
  • 查看密码
    .icon-chakanmima
  • 眼睛-闭
    .icon-yanjing-bi-01
  • 删除
    .icon-shanchu1
  • 度量
    .icon-duliang
  • 上下拖动
    .icon-shangxiatuodong
  • 选择
    .icon-xuanze
  • 复制转度量
    .icon-fuzhizhuanduliang2
  • 维度值图标
    .icon-wenzhidang
  • 抽取计划
    .icon-jihua
  • 抽取日志
    .icon-rizhi
  • 关闭
    .icon-guanbi1
  • 即席查询
    .icon-ico_jixichaxun
  • jinzhi-zidonghuancun
    .icon-jinzhi-zidonghuancun
  • bu-jiance
    .icon-bu-jiance
  • 检测
    .icon-jiance
  • 系统配置
    .icon-xitongpeizhi
  • 自动缓存
    .icon-zidonghuancun
  • 所有表
    .icon-suoyoubiao_o
  • 添加
    .icon-tianjia1
  • 系统参数
    .icon-xitongcanshu
  • 减少
    .icon-jianshao
  • 填报
    .icon-tianbao
  • 预览数据
    .icon-yulanshuju
  • 校验
    .icon-jiaoyan
  • 检测关系
    .icon-jianceguanxi
  • 移动端-感叹号
    .icon-gantanhao
  • 分析报表
    .icon-fenxibaobiao
  • 分析
    .icon-baobiaotongji
  • 模型
    .icon-moxingxuanzehedingjie-xuanzhong
  • 密码可见
    .icon-mimakejian
  • 密码不可见
    .icon-mimabukejian
  • 复制
    .icon-fuzhi1
  • 删除1
    .icon-guanbi2fill
  • 行为分析
    .icon-yonghushitihangweifenxishenqing
  • 指标模型
    .icon-a-performancemanagement
  • 维度
    .icon-duoweidu
  • 指标
    .icon-zhibiao
  • 事实表
    .icon-a-603-tongji8shuangse
  • 度量
    .icon-duliangguanli
  • 树选择
    .icon-fenzhijiedian
  • 水平布局
    .icon-shuipingfenbu2
  • 多选
    .icon-duoxuan
  • 密码
    .icon-mima
  • 下拉
    .icon-xiala
  • 单选
    .icon-danxuan
  • 文字
    .icon-duohangwenzi
  • 富文本
    .icon-uwenbenkuang
  • 级联
    .icon-jilianxuanze
  • 单行输入
    .icon-danhangwenben
  • 步骤条
    .icon-buzhoutiao
  • 垂直布局
    .icon-chuizhifenbu2
  • 开关
    .icon-kaiguan-guan
  • 多行输入
    .icon-duohangwenben
  • 手机
    .icon-shouji1
  • 电脑
    .icon-diannao1
  • 数据集
    .icon-fanhuishujuji
  • 检查依赖
    .icon-chakanyilaiguanxi
  • Foreach循环器
    .icon-cycle
  • 检查文件存在
    .icon-jiancha1
  • 检查字段值
    .icon-SQLcheck-o
  • 查看历史里面放图标
    .icon-xingzhuang
  • 学校
    .icon-xuexiao1
  • 双箭头1
    .icon-shuangjiantou1
  • 双箭头-下
    .icon-shuangjiantou-xia
  • 文件夹(关闭)
    .icon-wenjianjiaguanbi
  • 文件夹(打开)
    .icon-wenjianjiadakai
  • 刷新
    .icon-shuaxin1
  • 还原
    .icon-fanchexiao
  • 7撤销
    .icon-7chexiao
  • 放大
    .icon-sousuofangda
  • 缩小
    .icon-suoxiao
  • 原始大小
    .icon-suofang-yuanshichicun
  • 查看日志
    .icon-chakanrizhi
  • 固定
    .icon-pin
  • ETL自动化
    .icon-ETLzidonghua
  • 工作流
    .icon-gongzuoliu
  • 类型ETL
    .icon-ETL
  • 合并行
    .icon-hebinghang
  • 多表JOIN
    .icon-leftjoin
  • 行转列
    .icon-hangzhuanlie
  • 列转行
    .icon-liezhuanhang
  • 合并列
    .icon-hebing
  • 聚合
    .icon-shebeijuhe
  • 组合查询
    .icon-zuhe
  • JOIN
    .icon-tianjia
  • 元数据编辑
    .icon-zichanguanlian
  • 派生列
    .icon-lvzhou_fenzhichangsuo
  • 拆分列
    .icon--chaifenlie
  • 日期时间
    .icon-chakanlishi
  • 列选择
    .icon-liexuanze
  • 行选择
    .icon-hangxuanze
  • 值替换
    .icon-icon-1
  • 28-插入行
    .icon--charuhang
  • 替换
    .icon-tihuan
  • 空值处理
    .icon-jinbaoliugailie
  • daochuExcelmoban
    .icon-daochuExcelmoban
  • 去除重复值
    .icon-shanchuhang
  • 增加序列号
    .icon-a-idID
  • 过滤
    .icon-shujuguolv
  • 排序
    .icon-c098shengxupaixu
  • 数据清洗
    .icon--_shujuqingxi
  • 关系目标表
    .icon-a-zuzhiguanxi2
  • 导出数据大屏HDFS
    .icon-daochu
  • Kafka数据源
    .icon-Kafka
  • excel文件
    .icon-excelwenjian2
  • 示例数据源
    .icon--charushujuyuan
  • FTP数据源
    .icon-peizhishujuyuan
  • 数据集
    .icon-fuhefenxi
  • 文本数据源
    .icon-ico_shujuchaxunyutongji_yuyueqingkuangchaxun
  • KHCFDC_文本
    .icon-wenben
  • 关系数据源
    .icon-shujuyuan
  • icon_file_19
    .icon-icon_file_19
  • 读取excel sheet
    .icon-excel
  • 下载
    .icon-xiazai
  • 问号
    .icon-wenhao
  • 缓存
    .icon-system
  • 执行策略
    .icon-zhihangdaodangqianjiedian
  • icon-test79
    .icon-icon-test
  • 策略
    .icon-strategy
  • 定时任务
    .icon-lishijilu
  • 查看详情
    .icon-chakanxiangqing
  • 模型管理
    .icon-moxingguanli
  • 过滤
    .icon-guolv1
  • 计算器
    .icon-jisuanqi
  • 脱敏规则
    .icon-26tuominguize
  • 编组 28
    .icon-a-bianzu28
  • 3.1收藏-选中
    .icon-31shoucangxuanzhong
  • tuozai-jiantou
    .icon-tuozai-jiantou
  • youjiantou3
    .icon-youjiantou3
  • youjiantou2
    .icon-youjiantou2
  • 右箭头
    .icon-youjiantou1
  • 左箭头
    .icon-zuojiantou
  • a-28Etuodong
    .icon-a-28Etuodong
  • .icon-jian
  • 左箭头
    .icon-icon07
  • 右箭头
    .icon-youjiantou
  • 上一页
    .icon-shangyiye1
  • 下一页
    .icon-xiayiye1
  • 标识类_联动API
    .icon-biaoshilei_liandongAPI
  • 设置
    .icon-setting
  • 切换图表
    .icon-qiehuantubiao
  • 统计管理
    .icon-tongjiguanli
  • 打印
    .icon-dayin
  • 视图模式
    .icon-view-mode
  • 保存
    .icon-baocun
  • 16过滤
    .icon-guolv
  • 基础参数
    .icon-jichucanshu
  • 收藏
    .icon-shoucang
  • 导出文件
    .icon-daochuwenjian
  • 另存
    .icon-quanjuico_lingcunweishebeimoban
  • 字段设置
    .icon-ziduanshezhi
  • 文档下载
    .icon-wendangxiazai
  • cps_zht_nav_icon05ddyj
    .icon-cps_zht_nav_icon05ddyj
  • 提交成功
    .icon-tijiaochenggong
  • 禁止
    .icon-jinzhi
  • 卒中筛查
    .icon-zuzhongshaicha
  • 清空
    .icon-qingkong
  • 图表-函数
    .icon-tubiao-hanshu
  • 立即报名001
    .icon-lijibaoming
  • 编辑
    .icon-bianji
  • 删除
    .icon-icon_del
  • 人员
    .icon-renyuan
  • 教师_班级
    .icon-jiaoshi_banji
  • 团队展示
    .icon-tuanduizhanshi
  • 个人
    .icon-geren
  • 定位到图
    .icon-dingweixiao
  • 列表
    .icon-liebiao
  • 文件列表2
    .icon-wenjianliebiao2
  • ic_文件夹2
    .icon-ic_wenjianjia
  • 表单定制(模版)
    .icon-biaodandingzhimoban
  • 数据库
    .icon-shujuku
  • 对勾
    .icon-duigou
  • shangyi
    .icon-shangyi
  • shang
    .icon-shang
  • xia
    .icon-xia
  • xiayi
    .icon-xiayi
  • 关闭
    .icon-guanbi
  • 刷新
    .icon-shuaxin
  • 文档时间
    .icon-SX_030
  • 筛选
    .icon-shaixuan1
  • 放大镜
    .icon-ic_search24px
  • 添加
    .icon-tianjiadingdan1
  • 上传文件夹-01
    .icon-shangchuanwenjianjia-01
  • 刷新
    .icon-tubiao01
  • 新建_数据sql文件
    .icon-xinjian_shujusqlwenjian
  • 点击-click
    .icon-dianji-click
  • 复制
    .icon-fuzhi
  • 导入
    .icon-daoru
  • 导出2
    .icon-daochu2
  • 删除
    .icon-shanchu
  • 检测-16px
    .icon-jiance-16px
  • 手机
    .icon-shouji
  • 下箭头
    .icon-iconfonticonfonti2
  • 上箭头
    .icon-iconfonticonfonti2copy
  • 右箭头
    .icon-iconfonticonfonti2copycopy
  • .icon-icon--yes
  • 指标管理
    .icon-zhibiaoguanli
  • 系统管理
    .icon-xitongguanli
  • 文件-文件类别
    .icon-wj-wjlb
  • 筛选
    .icon-shaixuan
  • 数据库连接
    .icon-shujukulianjie
  • 加号-12
    .icon-jiahao-
  • 学校
    .icon-xuexiao
  • 电脑
    .icon-diannao
  • 压缩文件
    .icon-filezip
  • 创建路由
    .icon-chuangjianluyou
  • 时间
    .icon-shijian
  • 行转列
    .icon-uncollapsecolumns_ic
  • SQL升级文件
    .icon-SQLshengjiwenjian
  • icon_SQL
    .icon-icon_SQL
  • 脱敏_1
    .icon-tuomin_1
  • 表输入
    .icon-a-kuozhanicon_huaban1
  • excel输入
    .icon-a-kuozhanicon_huaban1fuben
  • excel输出
    .icon-a-kuozhanicon_huaban1fuben5
  • 表输出
    .icon-a-kuozhanicon_huaban1fuben4
  • 加密
    .icon-jiami
  • 构建表达式
    .icon-goujianbiaodashi
  • 主题,皮肤
    .icon-a-zhuti_huaban1
  • 转换
    .icon-zhuanhuan
  • .icon-dui
  • 叹号
    .icon-runtongyiyaoyihuifu_gantanhao-48
  • g箭头s
    .icon-gjiantous
  • 开始
    .icon-kaishi
  • 属性
    .icon-shuxing
  • 任务
    .icon-renwu
  • 参数设置
    .icon-canshupeizhi
  • 备注
    .icon-beizhu
  • 撤销
    .icon-chexiao
  • 重做
    .icon-zhongzuo
  • 操作-监听记录
    .icon-cz-jtjl
  • 操作-监听报告
    .icon-cz-jtbg
  • 任务管理
    .icon-renwuguanli
  • 检查
    .icon-jiancha
  • 任务流程
    .icon-renwuliucheng
  • 变量赋值
    .icon-bianliangfuzhi
  • 草稿箱
    .icon-caogaoxiang
  • SQL语言
    .icon-SQLyuyan
  • JavaCore分析
    .icon-JavaCorefenxigongju
  • SHELL
    .icon-a-kuozhanicon_huaban1fuben33
  • 布局-02
    .icon-buju-02
  • 任务管理
    .icon-renwuguanli1
  • 异常 (4)
    .icon-a-yichang4
  • email
    .icon-email
  • 箭头
    .icon-jiantou
  • 维修申请单
    .icon-weixiushenqingdan
  • 教务处
    .icon-caidanlan-bangong-shujushenhe
  • 电脑
    .icon-icon-
  • 配比数据库
    .icon-peibishujuku
  • 货物堆
    .icon-huowudui
  • 开始填报
    .icon-kaishitianbao
  • 维修情况
    .icon-weixiuqingkuang
  • 维修类别-01
    .icon-weixiuleibie-
  • 分析
    .icon-fenxi
  • publish-two发送2
    .icon-publish-twofasong2

font-class 引用


font-class 是 Unicode 使用方式的一种变种,主要是解决 Unicode 书写不直观,语意不明确的问题。

与 Unicode 使用方式相比,具有如下特点:

  • 相比于 Unicode 语意明确,书写更直观。可以很容易分辨这个 icon 是什么。
  • 因为使用 class 来定义图标,所以当要替换图标时,只需要修改 class 里面的 Unicode 引用。

使用步骤如下:

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

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

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

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

" iconfont" 是你项目下的 font-family。可以通过编辑项目查看,默认是 "iconfont"。

  • 复制
    #icon-fuzhi3
  • 计算列
    #icon-jisuanlie
  • 范围分组列
    #icon-fanweifenzulie
  • 枚举分组列
    #icon-meijufenzulie
  • 公共
    #icon-gonggong
  • 扫码
    #icon-saoma
  • 升序
    #icon-shengxu
  • 降序
    #icon-jiangxu
  • 时间
    #icon-shijian2
  • 日期
    #icon-riqi1
  • 关闭
    #icon-guanbi2
  • 撤销
    #icon-chexiao1
  • 分组
    #icon-fenzu
  • 数据表单
    #icon-shujubiaodan
  • 已锁定
    #icon-unlocked
  • 未锁定
    #icon-weisuoding
  • 验证码
    #icon-yanzhengma
  • 分割线
    #icon-fengexian1
  • 合并单元格
    #icon-hebingdanyuange1
  • 取消合并
    #icon-quxiaohebing
  • 24gl-borderAll
    #icon-24gl-borderAll
  • 24gl-borderBottom
    #icon-24gl-borderBottom
  • 24gl-borderInside
    #icon-24gl-borderInside
  • 24gl-borderOutside
    #icon-24gl-borderOutside
  • 24gl-borderTop
    #icon-24gl-borderTop
  • 24gl-borderNone
    #icon-24gl-borderNone
  • 24gl-borderInsideRow
    #icon-24gl-borderInsideRow
  • 24gl-borderLeft
    #icon-24gl-borderLeft
  • 24gl-borderRight
    #icon-24gl-borderRight
  • 24gl-borderInsideCol
    #icon-24gl-borderInsideCol
  • 附件
    #icon-fujian2
  • 启用
    #icon-qiyong
  • 中断
    #icon-duankai
  • 未开始
    #icon-jian1-copy
  • 表格边框设置
    #icon-biaogebiankuangshezhi
  • 取消合并单元格
    #icon-quxiaohebingdanyuange
  • 拆分单元格
    #icon-chaifendanyuange
  • 合并单元格
    #icon-hebingdanyuange
  • 电子签名
    #icon-dianziqianming
  • 预览 (1)
    #icon-a-yulan1
  • 图片
    #icon-tupian
  • 分割线
    #icon-fengexian
  • 表格
    #icon-biaoge1
  • 启用
    #icon-icon_list_qiyong
  • 表单
    #icon-biaodan
  • 眼睛3
    #icon-yanjing
  • 眼睛1
    #icon-yanjing2
  • 新建文件夹
    #icon-xinjianwenjianjia
  • 取消-cancel
    #icon-quxiao-cancel
  • 收到的分享
    #icon-shoudaodefenxiang
  • 我的发布
    #icon-wodefabu
  • 我的权限
    #icon-wodequanxian
  • 我的分享
    #icon-wodefenxiang
  • 我的收藏
    #icon-wodeshoucang
  • 最近访问
    #icon-zuijinfangwen
  • 用户
    #icon-yonghu
  • #icon-pen-fill
  • 取消分享
    #icon-quxiaofenxiang
  • 重发
    #icon-chongfa
  • 置顶
    #icon-zhiding
  • 模型
    #icon-moxing
  • 用户参数
    #icon-yonghucanshu
  • xinjianduliang
    #icon-xinjianduliang
  • 断开链接
    #icon-xialingyingicon-50
  • 叹号
    #icon-tanhao
  • 模块
    #icon-mokuai
  • 表格
    #icon-biaoge
  • 关闭任务_操作_jurassic
    #icon-jurassic_close-task
  • 删除多个文件
    #icon-a-kuozhanicon_huaban1fuben31
  • 日志
    #icon-rizhi1
  • 查看搜索
    #icon-chakansousuo
  • 删除数据
    #icon-database_delete
  • 复制
    #icon-fuzhi2
  • 移动
    #icon-yidong
  • 执行任务
    #icon-zhixingrenwu
  • 日期
    #icon-riqi
  • 时间
    #icon-shijian1
  • 列表
    #icon-liebiao2
  • 模型树
    #icon-tree
  • 转储凭证
    #icon-zhuanchupingzheng
  • 文件文档
    #icon-wenjianwendang
  • 刷新-F
    #icon-shuaxin-F
  • 禁止父项的继承权限传播到对象
    #icon-jinzhifuxiang
  • 关闭 (3)
    #icon-a-guanbi3
  • 月日
    #icon-yueri
  • 指标
    #icon-yewuzhibiao
  • 资源授权
    #icon-ziyuanshouquan
  • 操作权限
    #icon-caozuoquanxian
  • 文件夹对
    #icon-icon_wenjianjiadui
  • 移除
    #icon-yichu
  • 新建组
    #icon-xinjianzu
  • user-plus-light
    #icon-user-plus-light
  • 用户角色
    #icon-yonghujuese
  • 关联资源
    #icon-icon_list_guanlianziyuan
  • 地理位置
    #icon-appoffline
  • 时间标记
    #icon-shijianbiaoji
  • 编辑
    #icon-bianji-25
  • 平板
    #icon-pingban-view-h
  • 资源发布
    #icon-ziyuanfabu
  • MBE风格多色图标-艺术
    #icon-MBEfenggeduosetubiao-yishu
  • 文字
    #icon-wenzi
  • 悬停提示
    #icon-xuantingtishi
  • 还原
    #icon-restore
  • 是否显示1
    #icon-xianshikejian
  • 更多
    #icon-gengduo1
  • 最大化
    #icon-zuidahua
  • 筛选
    #icon-shaixuan4
  • 查看筛选条件
    #icon-shaixuan3
  • 组件切换
    #icon-qiehuantubiao1
  • 移动
    #icon-weizhiyidong
  • 浮动
    #icon-fudong
  • SQL
    #icon-SQL
  • 替换
    #icon-tihuan1
  • 字体颜色_文字操作_jurassic
    #icon-jurassic_font-color
  • 下划线
    #icon-shanchuxian
  • 云上传
    #icon-yunshangchuan
  • 主题
    #icon-t-shirt-fill
  • 替换数据源来源
    #icon-tihuantupian
  • 联动设置
    #icon-liandong
  • quxiaozhuanhuan
    #icon-quxiaozhuanhuan
  • 转换
    #icon-zhuanhuan1
  • 等比缩放高度铺满
    #icon-dengbisuofanggaodupuman
  • 全屏铺满
    #icon-quanpingpuman
  • 等比缩放宽度铺满
    #icon-dengbisuofangkuandupuman
  • 不刷新
    #icon-jinzhishuaxin
  • 操作
    #icon-caozuo
  • 画布缩放到最佳位置
    #icon-zuijiaweiz
  • 画布还原至100%
    #icon-xuxian
  • 鹰眼功能
    #icon-yingyan
  • 还原
    #icon-huanyuan
  • gengduo
    #icon-gengduo
  • hangbiao1
    #icon-hangbiao1
  • 列表
    #icon-liebiao1
  • 仪表盘标记
    #icon-biaoji
  • 仪表盘筛选
    #icon-shaixuan2
  • 箭头
    #icon-jiantou11
  • 右对齐
    #icon-youduiqi
  • 左对齐
    #icon-zuoduiqi
  • 左右对齐
    #icon-zuoyouduiqi
  • 加号
    #icon-jiahao
  • 添加子项
    #icon-tianjiazixiang
  • 参数0
    #icon-canshu1
  • 公共设置
    #icon-icon-setting-global
  • 左括号
    #icon-zuokuohao
  • 右括号
    #icon-youkuohao
  • 斜杠
    #icon-yihangyige
  • *
    #icon-a-
  • 表关系
    #icon-biaohuanxi01
  • me_首页
    #icon-me_shouye
  • 执行
    #icon-zhihang
  • 播放
    #icon-bofang
  • 任务执行
    #icon-renwuzhixing
  • 抽取并建宽表
    #icon-chouqubingjiankuanbiao
  • 错误
    #icon-cuowu
  • 增加
    #icon-zengjia
  • 减号
    #icon-jianhao
  • 等于
    #icon-dengyu
  • 语法
    #icon-yufa
  • fuzhizhuanduliang
    #icon-fuzhizhuanduliang
  • 查看密码
    #icon-chakanmima
  • 眼睛-闭
    #icon-yanjing-bi-01
  • 删除
    #icon-shanchu1
  • 度量
    #icon-duliang
  • 上下拖动
    #icon-shangxiatuodong
  • 选择
    #icon-xuanze
  • 复制转度量
    #icon-fuzhizhuanduliang2
  • 维度值图标
    #icon-wenzhidang
  • 抽取计划
    #icon-jihua
  • 抽取日志
    #icon-rizhi
  • 关闭
    #icon-guanbi1
  • 即席查询
    #icon-ico_jixichaxun
  • jinzhi-zidonghuancun
    #icon-jinzhi-zidonghuancun
  • bu-jiance
    #icon-bu-jiance
  • 检测
    #icon-jiance
  • 系统配置
    #icon-xitongpeizhi
  • 自动缓存
    #icon-zidonghuancun
  • 所有表
    #icon-suoyoubiao_o
  • 添加
    #icon-tianjia1
  • 系统参数
    #icon-xitongcanshu
  • 减少
    #icon-jianshao
  • 填报
    #icon-tianbao
  • 预览数据
    #icon-yulanshuju
  • 校验
    #icon-jiaoyan
  • 检测关系
    #icon-jianceguanxi
  • 移动端-感叹号
    #icon-gantanhao
  • 分析报表
    #icon-fenxibaobiao
  • 分析
    #icon-baobiaotongji
  • 模型
    #icon-moxingxuanzehedingjie-xuanzhong
  • 密码可见
    #icon-mimakejian
  • 密码不可见
    #icon-mimabukejian
  • 复制
    #icon-fuzhi1
  • 删除1
    #icon-guanbi2fill
  • 行为分析
    #icon-yonghushitihangweifenxishenqing
  • 指标模型
    #icon-a-performancemanagement
  • 维度
    #icon-duoweidu
  • 指标
    #icon-zhibiao
  • 事实表
    #icon-a-603-tongji8shuangse
  • 度量
    #icon-duliangguanli
  • 树选择
    #icon-fenzhijiedian
  • 水平布局
    #icon-shuipingfenbu2
  • 多选
    #icon-duoxuan
  • 密码
    #icon-mima
  • 下拉
    #icon-xiala
  • 单选
    #icon-danxuan
  • 文字
    #icon-duohangwenzi
  • 富文本
    #icon-uwenbenkuang
  • 级联
    #icon-jilianxuanze
  • 单行输入
    #icon-danhangwenben
  • 步骤条
    #icon-buzhoutiao
  • 垂直布局
    #icon-chuizhifenbu2
  • 开关
    #icon-kaiguan-guan
  • 多行输入
    #icon-duohangwenben
  • 手机
    #icon-shouji1
  • 电脑
    #icon-diannao1
  • 数据集
    #icon-fanhuishujuji
  • 检查依赖
    #icon-chakanyilaiguanxi
  • Foreach循环器
    #icon-cycle
  • 检查文件存在
    #icon-jiancha1
  • 检查字段值
    #icon-SQLcheck-o
  • 查看历史里面放图标
    #icon-xingzhuang
  • 学校
    #icon-xuexiao1
  • 双箭头1
    #icon-shuangjiantou1
  • 双箭头-下
    #icon-shuangjiantou-xia
  • 文件夹(关闭)
    #icon-wenjianjiaguanbi
  • 文件夹(打开)
    #icon-wenjianjiadakai
  • 刷新
    #icon-shuaxin1
  • 还原
    #icon-fanchexiao
  • 7撤销
    #icon-7chexiao
  • 放大
    #icon-sousuofangda
  • 缩小
    #icon-suoxiao
  • 原始大小
    #icon-suofang-yuanshichicun
  • 查看日志
    #icon-chakanrizhi
  • 固定
    #icon-pin
  • ETL自动化
    #icon-ETLzidonghua
  • 工作流
    #icon-gongzuoliu
  • 类型ETL
    #icon-ETL
  • 合并行
    #icon-hebinghang
  • 多表JOIN
    #icon-leftjoin
  • 行转列
    #icon-hangzhuanlie
  • 列转行
    #icon-liezhuanhang
  • 合并列
    #icon-hebing
  • 聚合
    #icon-shebeijuhe
  • 组合查询
    #icon-zuhe
  • JOIN
    #icon-tianjia
  • 元数据编辑
    #icon-zichanguanlian
  • 派生列
    #icon-lvzhou_fenzhichangsuo
  • 拆分列
    #icon--chaifenlie
  • 日期时间
    #icon-chakanlishi
  • 列选择
    #icon-liexuanze
  • 行选择
    #icon-hangxuanze
  • 值替换
    #icon-icon-1
  • 28-插入行
    #icon--charuhang
  • 替换
    #icon-tihuan
  • 空值处理
    #icon-jinbaoliugailie
  • daochuExcelmoban
    #icon-daochuExcelmoban
  • 去除重复值
    #icon-shanchuhang
  • 增加序列号
    #icon-a-idID
  • 过滤
    #icon-shujuguolv
  • 排序
    #icon-c098shengxupaixu
  • 数据清洗
    #icon--_shujuqingxi
  • 关系目标表
    #icon-a-zuzhiguanxi2
  • 导出数据大屏HDFS
    #icon-daochu
  • Kafka数据源
    #icon-Kafka
  • excel文件
    #icon-excelwenjian2
  • 示例数据源
    #icon--charushujuyuan
  • FTP数据源
    #icon-peizhishujuyuan
  • 数据集
    #icon-fuhefenxi
  • 文本数据源
    #icon-ico_shujuchaxunyutongji_yuyueqingkuangchaxun
  • KHCFDC_文本
    #icon-wenben
  • 关系数据源
    #icon-shujuyuan
  • icon_file_19
    #icon-icon_file_19
  • 读取excel sheet
    #icon-excel
  • 下载
    #icon-xiazai
  • 问号
    #icon-wenhao
  • 缓存
    #icon-system
  • 执行策略
    #icon-zhihangdaodangqianjiedian
  • icon-test79
    #icon-icon-test
  • 策略
    #icon-strategy
  • 定时任务
    #icon-lishijilu
  • 查看详情
    #icon-chakanxiangqing
  • 模型管理
    #icon-moxingguanli
  • 过滤
    #icon-guolv1
  • 计算器
    #icon-jisuanqi
  • 脱敏规则
    #icon-26tuominguize
  • 编组 28
    #icon-a-bianzu28
  • 3.1收藏-选中
    #icon-31shoucangxuanzhong
  • tuozai-jiantou
    #icon-tuozai-jiantou
  • youjiantou3
    #icon-youjiantou3
  • youjiantou2
    #icon-youjiantou2
  • 右箭头
    #icon-youjiantou1
  • 左箭头
    #icon-zuojiantou
  • a-28Etuodong
    #icon-a-28Etuodong
  • #icon-jian
  • 左箭头
    #icon-icon07
  • 右箭头
    #icon-youjiantou
  • 上一页
    #icon-shangyiye1
  • 下一页
    #icon-xiayiye1
  • 标识类_联动API
    #icon-biaoshilei_liandongAPI
  • 设置
    #icon-setting
  • 切换图表
    #icon-qiehuantubiao
  • 统计管理
    #icon-tongjiguanli
  • 打印
    #icon-dayin
  • 视图模式
    #icon-view-mode
  • 保存
    #icon-baocun
  • 16过滤
    #icon-guolv
  • 基础参数
    #icon-jichucanshu
  • 收藏
    #icon-shoucang
  • 导出文件
    #icon-daochuwenjian
  • 另存
    #icon-quanjuico_lingcunweishebeimoban
  • 字段设置
    #icon-ziduanshezhi
  • 文档下载
    #icon-wendangxiazai
  • cps_zht_nav_icon05ddyj
    #icon-cps_zht_nav_icon05ddyj
  • 提交成功
    #icon-tijiaochenggong
  • 禁止
    #icon-jinzhi
  • 卒中筛查
    #icon-zuzhongshaicha
  • 清空
    #icon-qingkong
  • 图表-函数
    #icon-tubiao-hanshu
  • 立即报名001
    #icon-lijibaoming
  • 编辑
    #icon-bianji
  • 删除
    #icon-icon_del
  • 人员
    #icon-renyuan
  • 教师_班级
    #icon-jiaoshi_banji
  • 团队展示
    #icon-tuanduizhanshi
  • 个人
    #icon-geren
  • 定位到图
    #icon-dingweixiao
  • 列表
    #icon-liebiao
  • 文件列表2
    #icon-wenjianliebiao2
  • ic_文件夹2
    #icon-ic_wenjianjia
  • 表单定制(模版)
    #icon-biaodandingzhimoban
  • 数据库
    #icon-shujuku
  • 对勾
    #icon-duigou
  • shangyi
    #icon-shangyi
  • shang
    #icon-shang
  • xia
    #icon-xia
  • xiayi
    #icon-xiayi
  • 关闭
    #icon-guanbi
  • 刷新
    #icon-shuaxin
  • 文档时间
    #icon-SX_030
  • 筛选
    #icon-shaixuan1
  • 放大镜
    #icon-ic_search24px
  • 添加
    #icon-tianjiadingdan1
  • 上传文件夹-01
    #icon-shangchuanwenjianjia-01
  • 刷新
    #icon-tubiao01
  • 新建_数据sql文件
    #icon-xinjian_shujusqlwenjian
  • 点击-click
    #icon-dianji-click
  • 复制
    #icon-fuzhi
  • 导入
    #icon-daoru
  • 导出2
    #icon-daochu2
  • 删除
    #icon-shanchu
  • 检测-16px
    #icon-jiance-16px
  • 手机
    #icon-shouji
  • 下箭头
    #icon-iconfonticonfonti2
  • 上箭头
    #icon-iconfonticonfonti2copy
  • 右箭头
    #icon-iconfonticonfonti2copycopy
  • #icon-icon--yes
  • 指标管理
    #icon-zhibiaoguanli
  • 系统管理
    #icon-xitongguanli
  • 文件-文件类别
    #icon-wj-wjlb
  • 筛选
    #icon-shaixuan
  • 数据库连接
    #icon-shujukulianjie
  • 加号-12
    #icon-jiahao-
  • 学校
    #icon-xuexiao
  • 电脑
    #icon-diannao
  • 压缩文件
    #icon-filezip
  • 创建路由
    #icon-chuangjianluyou
  • 时间
    #icon-shijian
  • 行转列
    #icon-uncollapsecolumns_ic
  • SQL升级文件
    #icon-SQLshengjiwenjian
  • icon_SQL
    #icon-icon_SQL
  • 脱敏_1
    #icon-tuomin_1
  • 表输入
    #icon-a-kuozhanicon_huaban1
  • excel输入
    #icon-a-kuozhanicon_huaban1fuben
  • excel输出
    #icon-a-kuozhanicon_huaban1fuben5
  • 表输出
    #icon-a-kuozhanicon_huaban1fuben4
  • 加密
    #icon-jiami
  • 构建表达式
    #icon-goujianbiaodashi
  • 主题,皮肤
    #icon-a-zhuti_huaban1
  • 转换
    #icon-zhuanhuan
  • #icon-dui
  • 叹号
    #icon-runtongyiyaoyihuifu_gantanhao-48
  • g箭头s
    #icon-gjiantous
  • 开始
    #icon-kaishi
  • 属性
    #icon-shuxing
  • 任务
    #icon-renwu
  • 参数设置
    #icon-canshupeizhi
  • 备注
    #icon-beizhu
  • 撤销
    #icon-chexiao
  • 重做
    #icon-zhongzuo
  • 操作-监听记录
    #icon-cz-jtjl
  • 操作-监听报告
    #icon-cz-jtbg
  • 任务管理
    #icon-renwuguanli
  • 检查
    #icon-jiancha
  • 任务流程
    #icon-renwuliucheng
  • 变量赋值
    #icon-bianliangfuzhi
  • 草稿箱
    #icon-caogaoxiang
  • SQL语言
    #icon-SQLyuyan
  • JavaCore分析
    #icon-JavaCorefenxigongju
  • SHELL
    #icon-a-kuozhanicon_huaban1fuben33
  • 布局-02
    #icon-buju-02
  • 任务管理
    #icon-renwuguanli1
  • 异常 (4)
    #icon-a-yichang4
  • email
    #icon-email
  • 箭头
    #icon-jiantou
  • 维修申请单
    #icon-weixiushenqingdan
  • 教务处
    #icon-caidanlan-bangong-shujushenhe
  • 电脑
    #icon-icon-
  • 配比数据库
    #icon-peibishujuku
  • 货物堆
    #icon-huowudui
  • 开始填报
    #icon-kaishitianbao
  • 维修情况
    #icon-weixiuqingkuang
  • 维修类别-01
    #icon-weixiuleibie-
  • 分析
    #icon-fenxi
  • publish-two发送2
    #icon-publish-twofasong2

Symbol 引用


这是一种全新的使用方式,应该说这才是未来的主流,也是平台目前推荐的用法。相关介绍可以参考这篇文章 这种用法其实是做了一个 SVG 的集合,与另外两种相比具有如下特点:

  • 支持多色图标了,不再受单色限制。
  • 通过一些技巧,支持像字体那样,通过 font-size, color 来调整样式。
  • 兼容性较差,支持 IE9+,及现代浏览器。
  • 浏览器渲染 SVG 的性能一般,还不如 png。

使用步骤如下:

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

<script src="./iconfont.js"></script>

第二步:加入通用 CSS 代码(引入一次就行):

<style>
.icon {
  width: 1em;
  height: 1em;
  vertical-align: -0.15em;
  fill: currentColor;
  overflow: hidden;
}
</style>

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

<svg class="icon" aria-hidden="true">
  <use xlink:href="#icon-xxx"></use>
</svg>