<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>iconfont Demo</title>
<link rel="shortcut icon" href="//img.alicdn.com/imgextra/i4/O1CN01Z5paLz1O0zuCC7osS_!!6000000001644-55-tps-83-82.svg" type="image/x-icon"/>
<link rel="icon" type="image/svg+xml" href="//img.alicdn.com/imgextra/i4/O1CN01Z5paLz1O0zuCC7osS_!!6000000001644-55-tps-83-82.svg"/>
<link rel="stylesheet" href="https://g.alicdn.com/thx/cube/1.3.2/cube.min.css">
<link rel="stylesheet" href="demo.css">
<link rel="stylesheet" href="iconfont.css">
<script src="iconfont.js"></script>
<!-- jQuery -->
<script src="https://a1.alicdn.com/oss/uploads/2018/12/26/7bfddb60-08e8-11e9-9b04-53e73bb6408b.js"></script>
<!-- 代码高亮 -->
<script src="https://a1.alicdn.com/oss/uploads/2018/12/26/a3f714d0-08e6-11e9-8a15-ebf944d7534c.js"></script>
<style>
.main .logo {
margin-top: 0;
height: auto;
}
.main .logo a {
display: flex;
align-items: center;
}
.main .logo .sub-title {
margin-left: 0.5em;
font-size: 22px;
color: #fff;
background: linear-gradient(-45deg, #3967FF, #B500FE);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
</style>
</head>
<body>
<div class="main">
<h1 class="logo"><a href="https://www.iconfont.cn/" title="iconfont 首页" target="_blank">
<img width="200" src="https://img.alicdn.com/imgextra/i3/O1CN01Mn65HV1FfSEzR6DKv_!!6000000000514-55-tps-228-59.svg">
</a></h1>
<div class="nav-tabs">
<ul id="tabs" class="dib-box">
<li class="dib active"><span>Unicode</span></li>
<li class="dib"><span>Font class</span></li>
<li class="dib"><span>Symbol</span></li>
</ul>
<a href="https://www.iconfont.cn/manage/index?manage_type=myprojects&projectId=3289090" target="_blank" class="nav-more">查看项目</a>
</div>
<div class="tab-container">
<div class="content unicode" style="display: block;">
<ul class="icon_lists dib-box">
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">降序</div>
<div class="code-name">&#xedc1;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">未排序</div>
<div class="code-name">&#xedc2;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">按钮-进入</div>
<div class="code-name">&#xedc3;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">升序</div>
<div class="code-name">&#xedc4;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">已还款</div>
<div class="code-name">&#xedb6;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">不可见20x20px</div>
<div class="code-name">&#xedb7;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">受理中</div>
<div class="code-name">&#xedb8;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">已完成</div>
<div class="code-name">&#xedb9;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">未签订</div>
<div class="code-name">&#xed8d;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">已签订</div>
<div class="code-name">&#xed8e;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">已结清</div>
<div class="code-name">&#xed8a;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">已发放</div>
<div class="code-name">&#xed8b;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">申请中</div>
<div class="code-name">&#xed8c;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">积分商城.32x32px</div>
<div class="code-name">&#xed76;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">理财产品.32x32px</div>
<div class="code-name">&#xed77;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">自助贷款.32x32px</div>
<div class="code-name">&#xed78;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">存款利息试算.32x32px</div>
<div class="code-name">&#xed79;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">签署文件.200x200px</div>
<div class="code-name">&#xed74;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">签署文件夹.200x200px-01</div>
<div class="code-name">&#xed75;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">产品.24x24px-客户经理小程序</div>
<div class="code-name">&#xed68;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">产品-选中.24x24px-客户经理小程序</div>
<div class="code-name">&#xed69;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">首页-选中.24x24px-客户经理小程序</div>
<div class="code-name">&#xed6a;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">任务新增.50x50px-客户经理小程序</div>
<div class="code-name">&#xed6b;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">二维码.18x18px-客户经理小程序</div>
<div class="code-name">&#xed6c;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">个人信息.18x18px-客户经理小程序</div>
<div class="code-name">&#xed6d;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">我的.24x24px-客户经理小程序</div>
<div class="code-name">&#xed6e;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">联系信息.18x18px-客户经理小程序</div>
<div class="code-name">&#xed6f;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">等级.32x32px-客户经理小程序</div>
<div class="code-name">&#xed70;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">我的-选中.24x24px-客户经理小程序</div>
<div class="code-name">&#xed71;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">主页.24x24px-客户经理小程序</div>
<div class="code-name">&#xed72;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">邀请关系查询.18x18px-客户经理小程序</div>
<div class="code-name">&#xed73;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">已发放.60x60px</div>
<div class="code-name">&#xed67;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">兑换记录.16x16px</div>
<div class="code-name">&#xed55;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">个人信息.16x16px</div>
<div class="code-name">&#xed56;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">存款利率.24x24px</div>
<div class="code-name">&#xed57;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">可见.20x20px</div>
<div class="code-name">&#xed58;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">成功.64x64px</div>
<div class="code-name">&#xed59;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">免费转账.24x24px</div>
<div class="code-name">&#xed5a;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">合作企业.16x16px</div>
<div class="code-name">&#xed5b;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">贷款利率.24x24px</div>
<div class="code-name">&#xed5c;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">首页-选中.20x20px</div>
<div class="code-name">&#xed5d;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">下一页.24x24px</div>
<div class="code-name">&#xed5e;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">我的.20x20px</div>
<div class="code-name">&#xed5f;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">专属客服.24x24px</div>
<div class="code-name">&#xed60;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">首页.20x20px</div>
<div class="code-name">&#xed61;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">我的贷款.16x16px</div>
<div class="code-name">&#xed62;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">我的-选中.20x20px</div>
<div class="code-name">&#xed63;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">未签署.60x60px</div>
<div class="code-name">&#xed64;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">已签署.60x60px</div>
<div class="code-name">&#xed65;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">已结清.60x60px</div>
<div class="code-name">&#xed66;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">16px搜索󅒐</div>
<div class="code-name">&#xe701;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">身份证人像面140x90px</div>
<div class="code-name">&#xe92a;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">16px-取消上传#808080</div>
<div class="code-name">&#xe7e7;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">14px下一级</div>
<div class="code-name">&#xe804;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">处理20x20px</div>
<div class="code-name">&#xed46;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">审批流程20x20px</div>
<div class="code-name">&#xed47;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">返回24x24px</div>
<div class="code-name">&#xed44;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">日历16x16px</div>
<div class="code-name">&#xed45;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">下拉20x20px</div>
<div class="code-name">&#xed43;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">进入24x24px</div>
<div class="code-name">&#xed41;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">移动审批72x72px</div>
<div class="code-name">&#xed42;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">新增-蓝色30X30px</div>
<div class="code-name">&#xed40;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">企业头像26x26px</div>
<div class="code-name">&#xed3c;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">人像100x100px</div>
<div class="code-name">&#xed3d;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">联网核查24x24px</div>
<div class="code-name">&#xed3e;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">人脸识别24x24px</div>
<div class="code-name">&#xed3f;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">计算器-未选中30x30px</div>
<div class="code-name">&#xed3a;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">计算器-选中30x30px</div>
<div class="code-name">&#xed3b;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">贷还款测算-未选中30x30px</div>
<div class="code-name">&#xed38;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">贷还款测算-选中30x30px</div>
<div class="code-name">&#xed39;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">通讯录-未选中30x30px</div>
<div class="code-name">&#xed36;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">通讯录-选中30x30px</div>
<div class="code-name">&#xed37;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">全景视图14x14px</div>
<div class="code-name">&#xed34;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">客户移交14x14px</div>
<div class="code-name">&#xed35;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">筛选22x22px</div>
<div class="code-name">&#xed30;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">业务申请情况40x40px</div>
<div class="code-name">&#xed2a;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">黑名单客户信息40x40px</div>
<div class="code-name">&#xed2b;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">未结清授信业务40x40px</div>
<div class="code-name">&#xed2c;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">已结清授信业务40x40px</div>
<div class="code-name">&#xed2d;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">为本行客户担保40x40px</div>
<div class="code-name">&#xed2e;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">被本行客户担保40x40px</div>
<div class="code-name">&#xed2f;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">影像资料40x40px</div>
<div class="code-name">&#xed24;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">生产经营40x40px</div>
<div class="code-name">&#xed25;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">个人资产40x40px</div>
<div class="code-name">&#xed26;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">征信信息40x40px</div>
<div class="code-name">&#xed27;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">家庭成员40x40px</div>
<div class="code-name">&#xed28;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">基本信息40x40px</div>
<div class="code-name">&#xed29;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">点击进入</div>
<div class="code-name">&#xed0b;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">100px未调查</div>
<div class="code-name">&#xecfe;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">100px已调查5</div>
<div class="code-name">&#xecff;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">100px已采集2</div>
<div class="code-name">&#xed00;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">100px已采集5</div>
<div class="code-name">&#xed01;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">100px已采集3</div>
<div class="code-name">&#xed02;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">100px已采集1</div>
<div class="code-name">&#xed03;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">100px已调查3</div>
<div class="code-name">&#xed04;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">100px已调查1</div>
<div class="code-name">&#xed05;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">100px已采集4</div>
<div class="code-name">&#xed06;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">100px已调查2</div>
<div class="code-name">&#xed07;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">100px已调查4</div>
<div class="code-name">&#xed08;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">100px未采集</div>
<div class="code-name">&#xed09;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">预授信额度60X60px</div>
<div class="code-name">&#xecfd;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">拍摄50x50px</div>
<div class="code-name">&#xecfc;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">拍照22x22px</div>
<div class="code-name">&#xecf3;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">影像目录文件夹</div>
<div class="code-name">&#xecfb;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">调查16X16px</div>
<div class="code-name">&#xeced;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">成功120X120px</div>
<div class="code-name">&#xecee;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">终止16X16px</div>
<div class="code-name">&#xecef;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">检查16X16px</div>
<div class="code-name">&#xecf0;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">待开始100X100px</div>
<div class="code-name">&#xecf1;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">导航16X16px</div>
<div class="code-name">&#xecf2;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">受理16X16px</div>
<div class="code-name">&#xecf4;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">电话16X16px</div>
<div class="code-name">&#xecf5;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">已完成100X100px</div>
<div class="code-name">&#xecf6;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">定位16X16px</div>
<div class="code-name">&#xecf7;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">指向20X20px</div>
<div class="code-name">&#xecf8;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">查看16X16px</div>
<div class="code-name">&#xecf9;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">拒绝16X16px</div>
<div class="code-name">&#xecfa;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">30px担保调查2</div>
<div class="code-name">&#xe686;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">60px授信申请</div>
<div class="code-name">&#xe695;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">借款人调查</div>
<div class="code-name">&#xe6a1;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">非农户信息采集100X100px</div>
<div class="code-name">&#xecea;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">农户信息采集100X100px</div>
<div class="code-name">&#xeceb;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">对公客户信息采集100X100px</div>
<div class="code-name">&#xecec;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">头像</div>
<div class="code-name">&#xece8;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">点击分析16x16px</div>
<div class="code-name">&#xece7;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">退出16x16px</div>
<div class="code-name">&#xece6;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">采集授权30X30px.选中</div>
<div class="code-name">&#xecd2;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">拍照20X20px</div>
<div class="code-name">&#xecd3;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">扫描24X24px</div>
<div class="code-name">&#xecd4;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">删除16X16px</div>
<div class="code-name">&#xecd5;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">采集授权30X30px</div>
<div class="code-name">&#xecd6;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">批量上传16X16px</div>
<div class="code-name">&#xecd7;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">详情16X16px</div>
<div class="code-name">&#xecd8;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">基本信息30X30px.选中</div>
<div class="code-name">&#xecd9;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">预授信30X30px.选中</div>
<div class="code-name">&#xecda;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">基本信息30X30px</div>
<div class="code-name">&#xecdb;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">身份核查30X30px</div>
<div class="code-name">&#xece0;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">影像采集30X30px.已选</div>
<div class="code-name">&#xece1;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">预授信30X30px</div>
<div class="code-name">&#xece2;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">影像采集30X30px</div>
<div class="code-name">&#xece3;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">修改16X16px</div>
<div class="code-name">&#xece4;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">身份核查30X30px.选中</div>
<div class="code-name">&#xece5;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">定位40X40px</div>
<div class="code-name">&#xecdc;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">关闭20X20px</div>
<div class="code-name">&#xecdd;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">人像24X24px</div>
<div class="code-name">&#xecde;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">新增30X30px</div>
<div class="code-name">&#xecdf;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">角色切换32x32px</div>
<div class="code-name">&#xecc7;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">设置32x32px</div>
<div class="code-name">&#xecc8;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">网点查询32x32px</div>
<div class="code-name">&#xecbf;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">产品中心32x32px</div>
<div class="code-name">&#xecc0;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">学习培训32x32px</div>
<div class="code-name">&#xecc1;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">信息采集32x32px</div>
<div class="code-name">&#xecc2;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">辅助工具32x32px</div>
<div class="code-name">&#xecc3;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">面对面营销32x32px</div>
<div class="code-name">&#xecc4;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">授信管理32x32px</div>
<div class="code-name">&#xecc5;</div>
</li>
<li class="dib">
<span class="icon iconfont"></span>
<div class="name">评级管理32x32px</div>
<div class="code-name">&#xecc6;</div>
</li>
</ul>
<div class="article markdown">
<h2 id="unicode-">Unicode 引用</h2>
<hr>
<p>Unicode 是字体在网页端最原始的应用方式，特点是：</p>
<ul>
<li>支持按字体的方式去动态调整图标大小，颜色等等。</li>
<li>默认情况下不支持多色，直接添加多色图标会自动去色。</li>
</ul>
<blockquote>
<p>注意：新版 iconfont 支持两种方式引用多色图标：SVG symbol 引用方式和彩色字体图标模式。（使用彩色字体图标需要在「编辑项目」中开启「彩色」选项后并重新生成。）</p>
</blockquote>
<p>Unicode 使用步骤如下：</p>
<h3 id="-font-face">第一步：拷贝项目下面生成的 <code>@font-face</code></h3>
<pre><code class="language-css"
>@font-face {
font-family: 'iconfont';
src: url('iconfont.woff2?t=1662601281933') format('woff2'),
url('iconfont.woff?t=1662601281933') format('woff'),
url('iconfont.ttf?t=1662601281933') format('truetype');
}
</code></pre>
<h3 id="-iconfont-">第二步：定义使用 iconfont 的样式</h3>
<pre><code class="language-css"
>.iconfont {
font-family: "iconfont" !important;
font-size: 16px;
font-style: normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
</code></pre>
<h3 id="-">第三步：挑选相应图标并获取字体编码，应用于页面</h3>
<pre>
<code class="language-html"
><span class="iconfont">&#x33;</span>
</code></pre>
<blockquote>
<p>"iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。</p>
</blockquote>
</div>
</div>
<div class="content font-class">
<ul class="icon_lists dib-box">
<li class="dib">
<span class="icon iconfont icon-jiangxu"></span>
<div class="name">
降序
</div>
<div class="code-name">.icon-jiangxu
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-weipaixu"></span>
<div class="name">
未排序
</div>
<div class="code-name">.icon-weipaixu
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-anniu-jinru"></span>
<div class="name">
按钮-进入
</div>
<div class="code-name">.icon-anniu-jinru
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-shengxu"></span>
<div class="name">
升序
</div>
<div class="code-name">.icon-shengxu
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-yihuankuan"></span>
<div class="name">
已还款
</div>
<div class="code-name">.icon-yihuankuan
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-bukejian20x20px"></span>
<div class="name">
不可见20x20px
</div>
<div class="code-name">.icon-bukejian20x20px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-shoulizhong"></span>
<div class="name">
受理中
</div>
<div class="code-name">.icon-shoulizhong
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-yiwancheng"></span>
<div class="name">
已完成
</div>
<div class="code-name">.icon-yiwancheng
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-weiqianding"></span>
<div class="name">
未签订
</div>
<div class="code-name">.icon-weiqianding
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-yiqianding"></span>
<div class="name">
已签订
</div>
<div class="code-name">.icon-yiqianding
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-yijieqing"></span>
<div class="name">
已结清
</div>
<div class="code-name">.icon-yijieqing
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-yifafang"></span>
<div class="name">
已发放
</div>
<div class="code-name">.icon-yifafang
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-shenqingzhong"></span>
<div class="name">
申请中
</div>
<div class="code-name">.icon-shenqingzhong
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-jifenshangcheng32x32px"></span>
<div class="name">
积分商城.32x32px
</div>
<div class="code-name">.icon-a-jifenshangcheng32x32px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-licaichanpin32x32px"></span>
<div class="name">
理财产品.32x32px
</div>
<div class="code-name">.icon-a-licaichanpin32x32px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-zizhudaikuan32x32px"></span>
<div class="name">
自助贷款.32x32px
</div>
<div class="code-name">.icon-a-zizhudaikuan32x32px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-cunkuanlixishisuan32x32px"></span>
<div class="name">
存款利息试算.32x32px
</div>
<div class="code-name">.icon-a-cunkuanlixishisuan32x32px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-qianshuwenjian200x200px"></span>
<div class="name">
签署文件.200x200px
</div>
<div class="code-name">.icon-a-qianshuwenjian200x200px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-qianshuwenjianjia200x200px-01"></span>
<div class="name">
签署文件夹.200x200px-01
</div>
<div class="code-name">.icon-a-qianshuwenjianjia200x200px-01
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-chanpin24x24px-kehujinglixiaochengxu"></span>
<div class="name">
产品.24x24px-客户经理小程序
</div>
<div class="code-name">.icon-a-chanpin24x24px-kehujinglixiaochengxu
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-chanpin-xuanzhong24x24px-kehujinglixiaochengxu"></span>
<div class="name">
产品-选中.24x24px-客户经理小程序
</div>
<div class="code-name">.icon-a-chanpin-xuanzhong24x24px-kehujinglixiaochengxu
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-shouye-xuanzhong24x24px-kehujinglixiaochengxu"></span>
<div class="name">
首页-选中.24x24px-客户经理小程序
</div>
<div class="code-name">.icon-a-shouye-xuanzhong24x24px-kehujinglixiaochengxu
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-renwuxinzeng50x50px-kehujinglixiaochengxu"></span>
<div class="name">
任务新增.50x50px-客户经理小程序
</div>
<div class="code-name">.icon-a-renwuxinzeng50x50px-kehujinglixiaochengxu
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-erweima18x18px-kehujinglixiaochengxu"></span>
<div class="name">
二维码.18x18px-客户经理小程序
</div>
<div class="code-name">.icon-a-erweima18x18px-kehujinglixiaochengxu
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-gerenxinxi18x18px-kehujinglixiaochengxu"></span>
<div class="name">
个人信息.18x18px-客户经理小程序
</div>
<div class="code-name">.icon-a-gerenxinxi18x18px-kehujinglixiaochengxu
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-wode24x24px-kehujinglixiaochengxu"></span>
<div class="name">
我的.24x24px-客户经理小程序
</div>
<div class="code-name">.icon-a-wode24x24px-kehujinglixiaochengxu
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-lianxixinxi18x18px-kehujinglixiaochengxu"></span>
<div class="name">
联系信息.18x18px-客户经理小程序
</div>
<div class="code-name">.icon-a-lianxixinxi18x18px-kehujinglixiaochengxu
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-dengji32x32px-kehujinglixiaochengxu"></span>
<div class="name">
等级.32x32px-客户经理小程序
</div>
<div class="code-name">.icon-a-dengji32x32px-kehujinglixiaochengxu
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-wode-xuanzhong24x24px-kehujinglixiaochengxu"></span>
<div class="name">
我的-选中.24x24px-客户经理小程序
</div>
<div class="code-name">.icon-a-wode-xuanzhong24x24px-kehujinglixiaochengxu
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-zhuye24x24px-kehujinglixiaochengxu"></span>
<div class="name">
主页.24x24px-客户经理小程序
</div>
<div class="code-name">.icon-a-zhuye24x24px-kehujinglixiaochengxu
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-yaoqingguanxichaxun18x18px-kehujinglixiaochengxu"></span>
<div class="name">
邀请关系查询.18x18px-客户经理小程序
</div>
<div class="code-name">.icon-a-yaoqingguanxichaxun18x18px-kehujinglixiaochengxu
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-yifafang60x60px"></span>
<div class="name">
已发放.60x60px
</div>
<div class="code-name">.icon-a-yifafang60x60px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-duihuanjilu16x16px"></span>
<div class="name">
兑换记录.16x16px
</div>
<div class="code-name">.icon-a-duihuanjilu16x16px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-gerenxinxi16x16px"></span>
<div class="name">
个人信息.16x16px
</div>
<div class="code-name">.icon-a-gerenxinxi16x16px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-cunkuanlishuai24x24px"></span>
<div class="name">
存款利率.24x24px
</div>
<div class="code-name">.icon-a-cunkuanlishuai24x24px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-kejian20x20px"></span>
<div class="name">
可见.20x20px
</div>
<div class="code-name">.icon-a-kejian20x20px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-chenggong64x64px"></span>
<div class="name">
成功.64x64px
</div>
<div class="code-name">.icon-a-chenggong64x64px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-mianfeizhuanzhang24x24px"></span>
<div class="name">
免费转账.24x24px
</div>
<div class="code-name">.icon-a-mianfeizhuanzhang24x24px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-hezuoqiye16x16px"></span>
<div class="name">
合作企业.16x16px
</div>
<div class="code-name">.icon-a-hezuoqiye16x16px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-daikuanlishuai24x24px"></span>
<div class="name">
贷款利率.24x24px
</div>
<div class="code-name">.icon-a-daikuanlishuai24x24px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-shouye-xuanzhong20x20px"></span>
<div class="name">
首页-选中.20x20px
</div>
<div class="code-name">.icon-a-shouye-xuanzhong20x20px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-xiayiye24x24px"></span>
<div class="name">
下一页.24x24px
</div>
<div class="code-name">.icon-a-xiayiye24x24px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-wode20x20px"></span>
<div class="name">
我的.20x20px
</div>
<div class="code-name">.icon-a-wode20x20px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-zhuanshukefu24x24px"></span>
<div class="name">
专属客服.24x24px
</div>
<div class="code-name">.icon-a-zhuanshukefu24x24px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-shouye20x20px"></span>
<div class="name">
首页.20x20px
</div>
<div class="code-name">.icon-a-shouye20x20px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-wodedaikuan16x16px"></span>
<div class="name">
我的贷款.16x16px
</div>
<div class="code-name">.icon-a-wodedaikuan16x16px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-wode-xuanzhong20x20px"></span>
<div class="name">
我的-选中.20x20px
</div>
<div class="code-name">.icon-a-wode-xuanzhong20x20px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-weiqianshu60x60px"></span>
<div class="name">
未签署.60x60px
</div>
<div class="code-name">.icon-a-weiqianshu60x60px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-yiqianshu60x60px"></span>
<div class="name">
已签署.60x60px
</div>
<div class="code-name">.icon-a-yiqianshu60x60px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-yijieqing60x60px"></span>
<div class="name">
已结清.60x60px
</div>
<div class="code-name">.icon-a-yijieqing60x60px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-pxsousuo"></span>
<div class="name">
16px搜索󅒐
</div>
<div class="code-name">.icon-pxsousuo
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-shenfenzhengrenxiangmian140x90px"></span>
<div class="name">
身份证人像面140x90px
</div>
<div class="code-name">.icon-shenfenzhengrenxiangmian140x90px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-px-quxiaoshangchuan"></span>
<div class="name">
16px-取消上传#808080
</div>
<div class="code-name">.icon-px-quxiaoshangchuan
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-pxxiayiji"></span>
<div class="name">
14px下一级
</div>
<div class="code-name">.icon-pxxiayiji
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-chuli20x20px"></span>
<div class="name">
处理20x20px
</div>
<div class="code-name">.icon-chuli20x20px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-shenpiliucheng20x20px"></span>
<div class="name">
审批流程20x20px
</div>
<div class="code-name">.icon-shenpiliucheng20x20px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-fanhui24x24px"></span>
<div class="name">
返回24x24px
</div>
<div class="code-name">.icon-fanhui24x24px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-rili16x16px"></span>
<div class="name">
日历16x16px
</div>
<div class="code-name">.icon-rili16x16px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-xiala20x20px"></span>
<div class="name">
下拉20x20px
</div>
<div class="code-name">.icon-xiala20x20px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-jinru24x24px"></span>
<div class="name">
进入24x24px
</div>
<div class="code-name">.icon-jinru24x24px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-yidongshenpi72x72px"></span>
<div class="name">
移动审批72x72px
</div>
<div class="code-name">.icon-yidongshenpi72x72px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-xinzeng-lanse30X30px"></span>
<div class="name">
新增-蓝色30X30px
</div>
<div class="code-name">.icon-xinzeng-lanse30X30px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-qiyetouxiang26x26px"></span>
<div class="name">
企业头像26x26px
</div>
<div class="code-name">.icon-qiyetouxiang26x26px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-renxiang100x100px"></span>
<div class="name">
人像100x100px
</div>
<div class="code-name">.icon-renxiang100x100px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-lianwanghecha24x24px"></span>
<div class="name">
联网核查24x24px
</div>
<div class="code-name">.icon-lianwanghecha24x24px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-renlianshibie24x24px"></span>
<div class="name">
人脸识别24x24px
</div>
<div class="code-name">.icon-renlianshibie24x24px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-jisuanqi-weixuanzhong30x30px"></span>
<div class="name">
计算器-未选中30x30px
</div>
<div class="code-name">.icon-jisuanqi-weixuanzhong30x30px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-jisuanqi-xuanzhong30x30px"></span>
<div class="name">
计算器-选中30x30px
</div>
<div class="code-name">.icon-jisuanqi-xuanzhong30x30px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-daihuankuancesuan-weixuanzhong30x30px"></span>
<div class="name">
贷还款测算-未选中30x30px
</div>
<div class="code-name">.icon-daihuankuancesuan-weixuanzhong30x30px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-daihuankuancesuan-xuanzhong30x30px"></span>
<div class="name">
贷还款测算-选中30x30px
</div>
<div class="code-name">.icon-daihuankuancesuan-xuanzhong30x30px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-tongxunlu-weixuanzhong30x30px"></span>
<div class="name">
通讯录-未选中30x30px
</div>
<div class="code-name">.icon-tongxunlu-weixuanzhong30x30px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-tongxunlu-xuanzhong30x30px"></span>
<div class="name">
通讯录-选中30x30px
</div>
<div class="code-name">.icon-tongxunlu-xuanzhong30x30px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-quanjingshitu14x14px"></span>
<div class="name">
全景视图14x14px
</div>
<div class="code-name">.icon-quanjingshitu14x14px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-kehuyijiao14x14px"></span>
<div class="name">
客户移交14x14px
</div>
<div class="code-name">.icon-kehuyijiao14x14px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-shaixuan22x22px"></span>
<div class="name">
筛选22x22px
</div>
<div class="code-name">.icon-shaixuan22x22px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-yewushenqingqingkuang40x40px"></span>
<div class="name">
业务申请情况40x40px
</div>
<div class="code-name">.icon-yewushenqingqingkuang40x40px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-heimingdankehuxinxi40x40px"></span>
<div class="name">
黑名单客户信息40x40px
</div>
<div class="code-name">.icon-heimingdankehuxinxi40x40px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-weijieqingshouxinyewu40x40px"></span>
<div class="name">
未结清授信业务40x40px
</div>
<div class="code-name">.icon-weijieqingshouxinyewu40x40px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-yijieqingshouxinyewu40x40px"></span>
<div class="name">
已结清授信业务40x40px
</div>
<div class="code-name">.icon-yijieqingshouxinyewu40x40px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-weibenhangkehudanbao40x40px"></span>
<div class="name">
为本行客户担保40x40px
</div>
<div class="code-name">.icon-weibenhangkehudanbao40x40px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-beibenhangkehudanbao40x40px"></span>
<div class="name">
被本行客户担保40x40px
</div>
<div class="code-name">.icon-beibenhangkehudanbao40x40px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-yingxiangziliao40x40px"></span>
<div class="name">
影像资料40x40px
</div>
<div class="code-name">.icon-yingxiangziliao40x40px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-shengchanjingying40x40px"></span>
<div class="name">
生产经营40x40px
</div>
<div class="code-name">.icon-shengchanjingying40x40px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-gerenzichan40x40px"></span>
<div class="name">
个人资产40x40px
</div>
<div class="code-name">.icon-gerenzichan40x40px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-zhengxinxinxi40x40px"></span>
<div class="name">
征信信息40x40px
</div>
<div class="code-name">.icon-zhengxinxinxi40x40px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-jiatingchengyuan40x40px"></span>
<div class="name">
家庭成员40x40px
</div>
<div class="code-name">.icon-jiatingchengyuan40x40px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-jibenxinxi40x40px"></span>
<div class="name">
基本信息40x40px
</div>
<div class="code-name">.icon-jibenxinxi40x40px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-dianjijinru"></span>
<div class="name">
点击进入
</div>
<div class="code-name">.icon-dianjijinru
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-100pxweitiaocha"></span>
<div class="name">
100px未调查
</div>
<div class="code-name">.icon-a-100pxweitiaocha
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-100pxyitiaocha5"></span>
<div class="name">
100px已调查5
</div>
<div class="code-name">.icon-a-100pxyitiaocha5
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-100pxyicaiji2"></span>
<div class="name">
100px已采集2
</div>
<div class="code-name">.icon-a-100pxyicaiji2
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-100pxyicaiji5"></span>
<div class="name">
100px已采集5
</div>
<div class="code-name">.icon-a-100pxyicaiji5
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-100pxyicaiji3"></span>
<div class="name">
100px已采集3
</div>
<div class="code-name">.icon-a-100pxyicaiji3
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-100pxyicaiji1"></span>
<div class="name">
100px已采集1
</div>
<div class="code-name">.icon-a-100pxyicaiji1
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-100pxyitiaocha3"></span>
<div class="name">
100px已调查3
</div>
<div class="code-name">.icon-a-100pxyitiaocha3
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-100pxyitiaocha1"></span>
<div class="name">
100px已调查1
</div>
<div class="code-name">.icon-a-100pxyitiaocha1
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-100pxyicaiji4"></span>
<div class="name">
100px已采集4
</div>
<div class="code-name">.icon-a-100pxyicaiji4
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-100pxyitiaocha2"></span>
<div class="name">
100px已调查2
</div>
<div class="code-name">.icon-a-100pxyitiaocha2
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-100pxyitiaocha4"></span>
<div class="name">
100px已调查4
</div>
<div class="code-name">.icon-a-100pxyitiaocha4
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-100pxweicaiji"></span>
<div class="name">
100px未采集
</div>
<div class="code-name">.icon-a-100pxweicaiji
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-yushouxinedu60X60px-01"></span>
<div class="name">
预授信额度60X60px
</div>
<div class="code-name">.icon-yushouxinedu60X60px-01
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-paishe50x50px"></span>
<div class="name">
拍摄50x50px
</div>
<div class="code-name">.icon-paishe50x50px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-paizhao22x22px"></span>
<div class="name">
拍照22x22px
</div>
<div class="code-name">.icon-paizhao22x22px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-yingxiangmuluwenjianjia"></span>
<div class="name">
影像目录文件夹
</div>
<div class="code-name">.icon-yingxiangmuluwenjianjia
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-tiaocha16X16px"></span>
<div class="name">
调查16X16px
</div>
<div class="code-name">.icon-tiaocha16X16px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-chenggong120X120px"></span>
<div class="name">
成功120X120px
</div>
<div class="code-name">.icon-chenggong120X120px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-zhongzhi16X16px"></span>
<div class="name">
终止16X16px
</div>
<div class="code-name">.icon-zhongzhi16X16px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-jiancha16X16px"></span>
<div class="name">
检查16X16px
</div>
<div class="code-name">.icon-jiancha16X16px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-daikaishi100X100px"></span>
<div class="name">
待开始100X100px
</div>
<div class="code-name">.icon-daikaishi100X100px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-daohang16X16px"></span>
<div class="name">
导航16X16px
</div>
<div class="code-name">.icon-daohang16X16px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-shouli16X16px"></span>
<div class="name">
受理16X16px
</div>
<div class="code-name">.icon-shouli16X16px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-dianhua16X16px"></span>
<div class="name">
电话16X16px
</div>
<div class="code-name">.icon-dianhua16X16px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-yiwancheng100X100px"></span>
<div class="name">
已完成100X100px
</div>
<div class="code-name">.icon-yiwancheng100X100px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-dingwei16X16px"></span>
<div class="name">
定位16X16px
</div>
<div class="code-name">.icon-dingwei16X16px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-zhixiang20X20px"></span>
<div class="name">
指向20X20px
</div>
<div class="code-name">.icon-zhixiang20X20px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-chakan16X16px"></span>
<div class="name">
查看16X16px
</div>
<div class="code-name">.icon-chakan16X16px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-jujue16X16px"></span>
<div class="name">
拒绝16X16px
</div>
<div class="code-name">.icon-jujue16X16px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-pxdanbaotiaocha1"></span>
<div class="name">
30px担保调查2
</div>
<div class="code-name">.icon-pxdanbaotiaocha1
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-pxshouxinshenqing"></span>
<div class="name">
60px授信申请
</div>
<div class="code-name">.icon-pxshouxinshenqing
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-jiekuanrentiaocha"></span>
<div class="name">
借款人调查
</div>
<div class="code-name">.icon-jiekuanrentiaocha
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-feinonghuxinxicaiji100X100px"></span>
<div class="name">
非农户信息采集100X100px
</div>
<div class="code-name">.icon-feinonghuxinxicaiji100X100px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-nonghuxinxicaiji100X100px"></span>
<div class="name">
农户信息采集100X100px
</div>
<div class="code-name">.icon-nonghuxinxicaiji100X100px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-duigongkehuxinxicaiji100X100px"></span>
<div class="name">
对公客户信息采集100X100px
</div>
<div class="code-name">.icon-duigongkehuxinxicaiji100X100px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-touxiang"></span>
<div class="name">
头像
</div>
<div class="code-name">.icon-touxiang
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-dianjifenxi16x16px"></span>
<div class="name">
点击分析16x16px
</div>
<div class="code-name">.icon-dianjifenxi16x16px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-tuichu16x16px"></span>
<div class="name">
退出16x16px
</div>
<div class="code-name">.icon-tuichu16x16px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-caijishouquan30X30pxxuanzhong"></span>
<div class="name">
采集授权30X30px.选中
</div>
<div class="code-name">.icon-a-caijishouquan30X30pxxuanzhong
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-paizhao20X20px"></span>
<div class="name">
拍照20X20px
</div>
<div class="code-name">.icon-paizhao20X20px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-saomiao24X24px"></span>
<div class="name">
扫描24X24px
</div>
<div class="code-name">.icon-saomiao24X24px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-shanchu16X16px"></span>
<div class="name">
删除16X16px
</div>
<div class="code-name">.icon-shanchu16X16px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-caijishouquan30X30px"></span>
<div class="name">
采集授权30X30px
</div>
<div class="code-name">.icon-caijishouquan30X30px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-piliangshangchuan16X16px"></span>
<div class="name">
批量上传16X16px
</div>
<div class="code-name">.icon-piliangshangchuan16X16px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-xiangqing16X16px"></span>
<div class="name">
详情16X16px
</div>
<div class="code-name">.icon-xiangqing16X16px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-jibenxinxi30X30pxxuanzhong"></span>
<div class="name">
基本信息30X30px.选中
</div>
<div class="code-name">.icon-a-jibenxinxi30X30pxxuanzhong
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-yushouxin30X30pxxuanzhong"></span>
<div class="name">
预授信30X30px.选中
</div>
<div class="code-name">.icon-a-yushouxin30X30pxxuanzhong
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-jibenxinxi30X30px"></span>
<div class="name">
基本信息30X30px
</div>
<div class="code-name">.icon-jibenxinxi30X30px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-shenfenhecha30X30px"></span>
<div class="name">
身份核查30X30px
</div>
<div class="code-name">.icon-shenfenhecha30X30px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-yingxiangcaiji30X30pxyixuan"></span>
<div class="name">
影像采集30X30px.已选
</div>
<div class="code-name">.icon-a-yingxiangcaiji30X30pxyixuan
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-yushouxin30X30px"></span>
<div class="name">
预授信30X30px
</div>
<div class="code-name">.icon-yushouxin30X30px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-yingxiangcaiji30X30px"></span>
<div class="name">
影像采集30X30px
</div>
<div class="code-name">.icon-yingxiangcaiji30X30px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-xiugai16X16px"></span>
<div class="name">
修改16X16px
</div>
<div class="code-name">.icon-xiugai16X16px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-shenfenhecha30X30pxxuanzhong"></span>
<div class="name">
身份核查30X30px.选中
</div>
<div class="code-name">.icon-a-shenfenhecha30X30pxxuanzhong
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-dingwei40X40px"></span>
<div class="name">
定位40X40px
</div>
<div class="code-name">.icon-dingwei40X40px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-guanbi20X20px"></span>
<div class="name">
关闭20X20px
</div>
<div class="code-name">.icon-guanbi20X20px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-renxiang24X24px"></span>
<div class="name">
人像24X24px
</div>
<div class="code-name">.icon-renxiang24X24px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-xinzeng30X30px"></span>
<div class="name">
新增30X30px
</div>
<div class="code-name">.icon-xinzeng30X30px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-jiaoseqiehuan32x32px"></span>
<div class="name">
角色切换32x32px
</div>
<div class="code-name">.icon-jiaoseqiehuan32x32px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-shezhi32x32px"></span>
<div class="name">
设置32x32px
</div>
<div class="code-name">.icon-shezhi32x32px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-wangdianchaxun32x32px"></span>
<div class="name">
网点查询32x32px
</div>
<div class="code-name">.icon-wangdianchaxun32x32px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-chanpinzhongxin32x32px"></span>
<div class="name">
产品中心32x32px
</div>
<div class="code-name">.icon-chanpinzhongxin32x32px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-xuexipeixun32x32px"></span>
<div class="name">
学习培训32x32px
</div>
<div class="code-name">.icon-xuexipeixun32x32px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-xinxicaiji32x32px"></span>
<div class="name">
信息采集32x32px
</div>
<div class="code-name">.icon-xinxicaiji32x32px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-fuzhugongju32x32px"></span>
<div class="name">
辅助工具32x32px
</div>
<div class="code-name">.icon-fuzhugongju32x32px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-mianduimianyingxiao32x32px"></span>
<div class="name">
面对面营销32x32px
</div>
<div class="code-name">.icon-mianduimianyingxiao32x32px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-shouxinguanli32x32px"></span>
<div class="name">
授信管理32x32px
</div>
<div class="code-name">.icon-shouxinguanli32x32px
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-pingjiguanli32x32px"></span>
<div class="name">
评级管理32x32px
</div>
<div class="code-name">.icon-pingjiguanli32x32px
</div>
</li>
</ul>
<div class="article markdown">
<h2 id="font-class-">font-class 引用</h2>
<hr>
<p>font-class 是 Unicode 使用方式的一种变种，主要是解决 Unicode 书写不直观，语意不明确的问题。</p>
<p>与 Unicode 使用方式相比，具有如下特点：</p>
<ul>
<li>相比于 Unicode 语意明确，书写更直观。可以很容易分辨这个 icon 是什么。</li>
<li>因为使用 class 来定义图标，所以当要替换图标时，只需要修改 class 里面的 Unicode 引用。</li>
</ul>
<p>使用步骤如下：</p>
<h3 id="-fontclass-">第一步：引入项目下面生成的 fontclass 代码：</h3>
<pre><code class="language-html"><link rel="stylesheet" href="./iconfont.css">
</code></pre>
<h3 id="-">第二步：挑选相应图标并获取类名，应用于页面：</h3>
<pre><code class="language-html"><span class="iconfont icon-xxx"></span>
</code></pre>
<blockquote>
<p>"
iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。</p>
</blockquote>
</div>
</div>
<div class="content symbol">
<ul class="icon_lists dib-box">
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-jiangxu"></use>
</svg>
<div class="name">降序</div>
<div class="code-name">#icon-jiangxu</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-weipaixu"></use>
</svg>
<div class="name">未排序</div>
<div class="code-name">#icon-weipaixu</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-anniu-jinru"></use>
</svg>
<div class="name">按钮-进入</div>
<div class="code-name">#icon-anniu-jinru</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-shengxu"></use>
</svg>
<div class="name">升序</div>
<div class="code-name">#icon-shengxu</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-yihuankuan"></use>
</svg>
<div class="name">已还款</div>
<div class="code-name">#icon-yihuankuan</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-bukejian20x20px"></use>
</svg>
<div class="name">不可见20x20px</div>
<div class="code-name">#icon-bukejian20x20px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-shoulizhong"></use>
</svg>
<div class="name">受理中</div>
<div class="code-name">#icon-shoulizhong</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-yiwancheng"></use>
</svg>
<div class="name">已完成</div>
<div class="code-name">#icon-yiwancheng</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-weiqianding"></use>
</svg>
<div class="name">未签订</div>
<div class="code-name">#icon-weiqianding</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-yiqianding"></use>
</svg>
<div class="name">已签订</div>
<div class="code-name">#icon-yiqianding</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-yijieqing"></use>
</svg>
<div class="name">已结清</div>
<div class="code-name">#icon-yijieqing</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-yifafang"></use>
</svg>
<div class="name">已发放</div>
<div class="code-name">#icon-yifafang</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-shenqingzhong"></use>
</svg>
<div class="name">申请中</div>
<div class="code-name">#icon-shenqingzhong</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-jifenshangcheng32x32px"></use>
</svg>
<div class="name">积分商城.32x32px</div>
<div class="code-name">#icon-a-jifenshangcheng32x32px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-licaichanpin32x32px"></use>
</svg>
<div class="name">理财产品.32x32px</div>
<div class="code-name">#icon-a-licaichanpin32x32px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-zizhudaikuan32x32px"></use>
</svg>
<div class="name">自助贷款.32x32px</div>
<div class="code-name">#icon-a-zizhudaikuan32x32px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-cunkuanlixishisuan32x32px"></use>
</svg>
<div class="name">存款利息试算.32x32px</div>
<div class="code-name">#icon-a-cunkuanlixishisuan32x32px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-qianshuwenjian200x200px"></use>
</svg>
<div class="name">签署文件.200x200px</div>
<div class="code-name">#icon-a-qianshuwenjian200x200px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-qianshuwenjianjia200x200px-01"></use>
</svg>
<div class="name">签署文件夹.200x200px-01</div>
<div class="code-name">#icon-a-qianshuwenjianjia200x200px-01</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-chanpin24x24px-kehujinglixiaochengxu"></use>
</svg>
<div class="name">产品.24x24px-客户经理小程序</div>
<div class="code-name">#icon-a-chanpin24x24px-kehujinglixiaochengxu</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-chanpin-xuanzhong24x24px-kehujinglixiaochengxu"></use>
</svg>
<div class="name">产品-选中.24x24px-客户经理小程序</div>
<div class="code-name">#icon-a-chanpin-xuanzhong24x24px-kehujinglixiaochengxu</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-shouye-xuanzhong24x24px-kehujinglixiaochengxu"></use>
</svg>
<div class="name">首页-选中.24x24px-客户经理小程序</div>
<div class="code-name">#icon-a-shouye-xuanzhong24x24px-kehujinglixiaochengxu</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-renwuxinzeng50x50px-kehujinglixiaochengxu"></use>
</svg>
<div class="name">任务新增.50x50px-客户经理小程序</div>
<div class="code-name">#icon-a-renwuxinzeng50x50px-kehujinglixiaochengxu</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-erweima18x18px-kehujinglixiaochengxu"></use>
</svg>
<div class="name">二维码.18x18px-客户经理小程序</div>
<div class="code-name">#icon-a-erweima18x18px-kehujinglixiaochengxu</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-gerenxinxi18x18px-kehujinglixiaochengxu"></use>
</svg>
<div class="name">个人信息.18x18px-客户经理小程序</div>
<div class="code-name">#icon-a-gerenxinxi18x18px-kehujinglixiaochengxu</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-wode24x24px-kehujinglixiaochengxu"></use>
</svg>
<div class="name">我的.24x24px-客户经理小程序</div>
<div class="code-name">#icon-a-wode24x24px-kehujinglixiaochengxu</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-lianxixinxi18x18px-kehujinglixiaochengxu"></use>
</svg>
<div class="name">联系信息.18x18px-客户经理小程序</div>
<div class="code-name">#icon-a-lianxixinxi18x18px-kehujinglixiaochengxu</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-dengji32x32px-kehujinglixiaochengxu"></use>
</svg>
<div class="name">等级.32x32px-客户经理小程序</div>
<div class="code-name">#icon-a-dengji32x32px-kehujinglixiaochengxu</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-wode-xuanzhong24x24px-kehujinglixiaochengxu"></use>
</svg>
<div class="name">我的-选中.24x24px-客户经理小程序</div>
<div class="code-name">#icon-a-wode-xuanzhong24x24px-kehujinglixiaochengxu</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-zhuye24x24px-kehujinglixiaochengxu"></use>
</svg>
<div class="name">主页.24x24px-客户经理小程序</div>
<div class="code-name">#icon-a-zhuye24x24px-kehujinglixiaochengxu</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-yaoqingguanxichaxun18x18px-kehujinglixiaochengxu"></use>
</svg>
<div class="name">邀请关系查询.18x18px-客户经理小程序</div>
<div class="code-name">#icon-a-yaoqingguanxichaxun18x18px-kehujinglixiaochengxu</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-yifafang60x60px"></use>
</svg>
<div class="name">已发放.60x60px</div>
<div class="code-name">#icon-a-yifafang60x60px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-duihuanjilu16x16px"></use>
</svg>
<div class="name">兑换记录.16x16px</div>
<div class="code-name">#icon-a-duihuanjilu16x16px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-gerenxinxi16x16px"></use>
</svg>
<div class="name">个人信息.16x16px</div>
<div class="code-name">#icon-a-gerenxinxi16x16px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-cunkuanlishuai24x24px"></use>
</svg>
<div class="name">存款利率.24x24px</div>
<div class="code-name">#icon-a-cunkuanlishuai24x24px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-kejian20x20px"></use>
</svg>
<div class="name">可见.20x20px</div>
<div class="code-name">#icon-a-kejian20x20px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-chenggong64x64px"></use>
</svg>
<div class="name">成功.64x64px</div>
<div class="code-name">#icon-a-chenggong64x64px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-mianfeizhuanzhang24x24px"></use>
</svg>
<div class="name">免费转账.24x24px</div>
<div class="code-name">#icon-a-mianfeizhuanzhang24x24px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-hezuoqiye16x16px"></use>
</svg>
<div class="name">合作企业.16x16px</div>
<div class="code-name">#icon-a-hezuoqiye16x16px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-daikuanlishuai24x24px"></use>
</svg>
<div class="name">贷款利率.24x24px</div>
<div class="code-name">#icon-a-daikuanlishuai24x24px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-shouye-xuanzhong20x20px"></use>
</svg>
<div class="name">首页-选中.20x20px</div>
<div class="code-name">#icon-a-shouye-xuanzhong20x20px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-xiayiye24x24px"></use>
</svg>
<div class="name">下一页.24x24px</div>
<div class="code-name">#icon-a-xiayiye24x24px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-wode20x20px"></use>
</svg>
<div class="name">我的.20x20px</div>
<div class="code-name">#icon-a-wode20x20px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-zhuanshukefu24x24px"></use>
</svg>
<div class="name">专属客服.24x24px</div>
<div class="code-name">#icon-a-zhuanshukefu24x24px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-shouye20x20px"></use>
</svg>
<div class="name">首页.20x20px</div>
<div class="code-name">#icon-a-shouye20x20px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-wodedaikuan16x16px"></use>
</svg>
<div class="name">我的贷款.16x16px</div>
<div class="code-name">#icon-a-wodedaikuan16x16px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-wode-xuanzhong20x20px"></use>
</svg>
<div class="name">我的-选中.20x20px</div>
<div class="code-name">#icon-a-wode-xuanzhong20x20px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-weiqianshu60x60px"></use>
</svg>
<div class="name">未签署.60x60px</div>
<div class="code-name">#icon-a-weiqianshu60x60px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-yiqianshu60x60px"></use>
</svg>
<div class="name">已签署.60x60px</div>
<div class="code-name">#icon-a-yiqianshu60x60px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-yijieqing60x60px"></use>
</svg>
<div class="name">已结清.60x60px</div>
<div class="code-name">#icon-a-yijieqing60x60px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-pxsousuo"></use>
</svg>
<div class="name">16px搜索󅒐</div>
<div class="code-name">#icon-pxsousuo</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-shenfenzhengrenxiangmian140x90px"></use>
</svg>
<div class="name">身份证人像面140x90px</div>
<div class="code-name">#icon-shenfenzhengrenxiangmian140x90px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-px-quxiaoshangchuan"></use>
</svg>
<div class="name">16px-取消上传#808080</div>
<div class="code-name">#icon-px-quxiaoshangchuan</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-pxxiayiji"></use>
</svg>
<div class="name">14px下一级</div>
<div class="code-name">#icon-pxxiayiji</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-chuli20x20px"></use>
</svg>
<div class="name">处理20x20px</div>
<div class="code-name">#icon-chuli20x20px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-shenpiliucheng20x20px"></use>
</svg>
<div class="name">审批流程20x20px</div>
<div class="code-name">#icon-shenpiliucheng20x20px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-fanhui24x24px"></use>
</svg>
<div class="name">返回24x24px</div>
<div class="code-name">#icon-fanhui24x24px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-rili16x16px"></use>
</svg>
<div class="name">日历16x16px</div>
<div class="code-name">#icon-rili16x16px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-xiala20x20px"></use>
</svg>
<div class="name">下拉20x20px</div>
<div class="code-name">#icon-xiala20x20px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-jinru24x24px"></use>
</svg>
<div class="name">进入24x24px</div>
<div class="code-name">#icon-jinru24x24px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-yidongshenpi72x72px"></use>
</svg>
<div class="name">移动审批72x72px</div>
<div class="code-name">#icon-yidongshenpi72x72px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-xinzeng-lanse30X30px"></use>
</svg>
<div class="name">新增-蓝色30X30px</div>
<div class="code-name">#icon-xinzeng-lanse30X30px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-qiyetouxiang26x26px"></use>
</svg>
<div class="name">企业头像26x26px</div>
<div class="code-name">#icon-qiyetouxiang26x26px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-renxiang100x100px"></use>
</svg>
<div class="name">人像100x100px</div>
<div class="code-name">#icon-renxiang100x100px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-lianwanghecha24x24px"></use>
</svg>
<div class="name">联网核查24x24px</div>
<div class="code-name">#icon-lianwanghecha24x24px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-renlianshibie24x24px"></use>
</svg>
<div class="name">人脸识别24x24px</div>
<div class="code-name">#icon-renlianshibie24x24px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-jisuanqi-weixuanzhong30x30px"></use>
</svg>
<div class="name">计算器-未选中30x30px</div>
<div class="code-name">#icon-jisuanqi-weixuanzhong30x30px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-jisuanqi-xuanzhong30x30px"></use>
</svg>
<div class="name">计算器-选中30x30px</div>
<div class="code-name">#icon-jisuanqi-xuanzhong30x30px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-daihuankuancesuan-weixuanzhong30x30px"></use>
</svg>
<div class="name">贷还款测算-未选中30x30px</div>
<div class="code-name">#icon-daihuankuancesuan-weixuanzhong30x30px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-daihuankuancesuan-xuanzhong30x30px"></use>
</svg>
<div class="name">贷还款测算-选中30x30px</div>
<div class="code-name">#icon-daihuankuancesuan-xuanzhong30x30px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-tongxunlu-weixuanzhong30x30px"></use>
</svg>
<div class="name">通讯录-未选中30x30px</div>
<div class="code-name">#icon-tongxunlu-weixuanzhong30x30px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-tongxunlu-xuanzhong30x30px"></use>
</svg>
<div class="name">通讯录-选中30x30px</div>
<div class="code-name">#icon-tongxunlu-xuanzhong30x30px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-quanjingshitu14x14px"></use>
</svg>
<div class="name">全景视图14x14px</div>
<div class="code-name">#icon-quanjingshitu14x14px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-kehuyijiao14x14px"></use>
</svg>
<div class="name">客户移交14x14px</div>
<div class="code-name">#icon-kehuyijiao14x14px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-shaixuan22x22px"></use>
</svg>
<div class="name">筛选22x22px</div>
<div class="code-name">#icon-shaixuan22x22px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-yewushenqingqingkuang40x40px"></use>
</svg>
<div class="name">业务申请情况40x40px</div>
<div class="code-name">#icon-yewushenqingqingkuang40x40px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-heimingdankehuxinxi40x40px"></use>
</svg>
<div class="name">黑名单客户信息40x40px</div>
<div class="code-name">#icon-heimingdankehuxinxi40x40px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-weijieqingshouxinyewu40x40px"></use>
</svg>
<div class="name">未结清授信业务40x40px</div>
<div class="code-name">#icon-weijieqingshouxinyewu40x40px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-yijieqingshouxinyewu40x40px"></use>
</svg>
<div class="name">已结清授信业务40x40px</div>
<div class="code-name">#icon-yijieqingshouxinyewu40x40px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-weibenhangkehudanbao40x40px"></use>
</svg>
<div class="name">为本行客户担保40x40px</div>
<div class="code-name">#icon-weibenhangkehudanbao40x40px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-beibenhangkehudanbao40x40px"></use>
</svg>
<div class="name">被本行客户担保40x40px</div>
<div class="code-name">#icon-beibenhangkehudanbao40x40px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-yingxiangziliao40x40px"></use>
</svg>
<div class="name">影像资料40x40px</div>
<div class="code-name">#icon-yingxiangziliao40x40px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-shengchanjingying40x40px"></use>
</svg>
<div class="name">生产经营40x40px</div>
<div class="code-name">#icon-shengchanjingying40x40px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-gerenzichan40x40px"></use>
</svg>
<div class="name">个人资产40x40px</div>
<div class="code-name">#icon-gerenzichan40x40px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-zhengxinxinxi40x40px"></use>
</svg>
<div class="name">征信信息40x40px</div>
<div class="code-name">#icon-zhengxinxinxi40x40px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-jiatingchengyuan40x40px"></use>
</svg>
<div class="name">家庭成员40x40px</div>
<div class="code-name">#icon-jiatingchengyuan40x40px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-jibenxinxi40x40px"></use>
</svg>
<div class="name">基本信息40x40px</div>
<div class="code-name">#icon-jibenxinxi40x40px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-dianjijinru"></use>
</svg>
<div class="name">点击进入</div>
<div class="code-name">#icon-dianjijinru</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-100pxweitiaocha"></use>
</svg>
<div class="name">100px未调查</div>
<div class="code-name">#icon-a-100pxweitiaocha</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-100pxyitiaocha5"></use>
</svg>
<div class="name">100px已调查5</div>
<div class="code-name">#icon-a-100pxyitiaocha5</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-100pxyicaiji2"></use>
</svg>
<div class="name">100px已采集2</div>
<div class="code-name">#icon-a-100pxyicaiji2</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-100pxyicaiji5"></use>
</svg>
<div class="name">100px已采集5</div>
<div class="code-name">#icon-a-100pxyicaiji5</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-100pxyicaiji3"></use>
</svg>
<div class="name">100px已采集3</div>
<div class="code-name">#icon-a-100pxyicaiji3</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-100pxyicaiji1"></use>
</svg>
<div class="name">100px已采集1</div>
<div class="code-name">#icon-a-100pxyicaiji1</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-100pxyitiaocha3"></use>
</svg>
<div class="name">100px已调查3</div>
<div class="code-name">#icon-a-100pxyitiaocha3</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-100pxyitiaocha1"></use>
</svg>
<div class="name">100px已调查1</div>
<div class="code-name">#icon-a-100pxyitiaocha1</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-100pxyicaiji4"></use>
</svg>
<div class="name">100px已采集4</div>
<div class="code-name">#icon-a-100pxyicaiji4</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-100pxyitiaocha2"></use>
</svg>
<div class="name">100px已调查2</div>
<div class="code-name">#icon-a-100pxyitiaocha2</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-100pxyitiaocha4"></use>
</svg>
<div class="name">100px已调查4</div>
<div class="code-name">#icon-a-100pxyitiaocha4</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-100pxweicaiji"></use>
</svg>
<div class="name">100px未采集</div>
<div class="code-name">#icon-a-100pxweicaiji</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-yushouxinedu60X60px-01"></use>
</svg>
<div class="name">预授信额度60X60px</div>
<div class="code-name">#icon-yushouxinedu60X60px-01</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-paishe50x50px"></use>
</svg>
<div class="name">拍摄50x50px</div>
<div class="code-name">#icon-paishe50x50px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-paizhao22x22px"></use>
</svg>
<div class="name">拍照22x22px</div>
<div class="code-name">#icon-paizhao22x22px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-yingxiangmuluwenjianjia"></use>
</svg>
<div class="name">影像目录文件夹</div>
<div class="code-name">#icon-yingxiangmuluwenjianjia</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-tiaocha16X16px"></use>
</svg>
<div class="name">调查16X16px</div>
<div class="code-name">#icon-tiaocha16X16px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-chenggong120X120px"></use>
</svg>
<div class="name">成功120X120px</div>
<div class="code-name">#icon-chenggong120X120px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-zhongzhi16X16px"></use>
</svg>
<div class="name">终止16X16px</div>
<div class="code-name">#icon-zhongzhi16X16px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-jiancha16X16px"></use>
</svg>
<div class="name">检查16X16px</div>
<div class="code-name">#icon-jiancha16X16px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-daikaishi100X100px"></use>
</svg>
<div class="name">待开始100X100px</div>
<div class="code-name">#icon-daikaishi100X100px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-daohang16X16px"></use>
</svg>
<div class="name">导航16X16px</div>
<div class="code-name">#icon-daohang16X16px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-shouli16X16px"></use>
</svg>
<div class="name">受理16X16px</div>
<div class="code-name">#icon-shouli16X16px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-dianhua16X16px"></use>
</svg>
<div class="name">电话16X16px</div>
<div class="code-name">#icon-dianhua16X16px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-yiwancheng100X100px"></use>
</svg>
<div class="name">已完成100X100px</div>
<div class="code-name">#icon-yiwancheng100X100px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-dingwei16X16px"></use>
</svg>
<div class="name">定位16X16px</div>
<div class="code-name">#icon-dingwei16X16px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-zhixiang20X20px"></use>
</svg>
<div class="name">指向20X20px</div>
<div class="code-name">#icon-zhixiang20X20px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-chakan16X16px"></use>
</svg>
<div class="name">查看16X16px</div>
<div class="code-name">#icon-chakan16X16px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-jujue16X16px"></use>
</svg>
<div class="name">拒绝16X16px</div>
<div class="code-name">#icon-jujue16X16px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-pxdanbaotiaocha1"></use>
</svg>
<div class="name">30px担保调查2</div>
<div class="code-name">#icon-pxdanbaotiaocha1</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-pxshouxinshenqing"></use>
</svg>
<div class="name">60px授信申请</div>
<div class="code-name">#icon-pxshouxinshenqing</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-jiekuanrentiaocha"></use>
</svg>
<div class="name">借款人调查</div>
<div class="code-name">#icon-jiekuanrentiaocha</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-feinonghuxinxicaiji100X100px"></use>
</svg>
<div class="name">非农户信息采集100X100px</div>
<div class="code-name">#icon-feinonghuxinxicaiji100X100px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-nonghuxinxicaiji100X100px"></use>
</svg>
<div class="name">农户信息采集100X100px</div>
<div class="code-name">#icon-nonghuxinxicaiji100X100px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-duigongkehuxinxicaiji100X100px"></use>
</svg>
<div class="name">对公客户信息采集100X100px</div>
<div class="code-name">#icon-duigongkehuxinxicaiji100X100px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-touxiang"></use>
</svg>
<div class="name">头像</div>
<div class="code-name">#icon-touxiang</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-dianjifenxi16x16px"></use>
</svg>
<div class="name">点击分析16x16px</div>
<div class="code-name">#icon-dianjifenxi16x16px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-tuichu16x16px"></use>
</svg>
<div class="name">退出16x16px</div>
<div class="code-name">#icon-tuichu16x16px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-caijishouquan30X30pxxuanzhong"></use>
</svg>
<div class="name">采集授权30X30px.选中</div>
<div class="code-name">#icon-a-caijishouquan30X30pxxuanzhong</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-paizhao20X20px"></use>
</svg>
<div class="name">拍照20X20px</div>
<div class="code-name">#icon-paizhao20X20px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-saomiao24X24px"></use>
</svg>
<div class="name">扫描24X24px</div>
<div class="code-name">#icon-saomiao24X24px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-shanchu16X16px"></use>
</svg>
<div class="name">删除16X16px</div>
<div class="code-name">#icon-shanchu16X16px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-caijishouquan30X30px"></use>
</svg>
<div class="name">采集授权30X30px</div>
<div class="code-name">#icon-caijishouquan30X30px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-piliangshangchuan16X16px"></use>
</svg>
<div class="name">批量上传16X16px</div>
<div class="code-name">#icon-piliangshangchuan16X16px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-xiangqing16X16px"></use>
</svg>
<div class="name">详情16X16px</div>
<div class="code-name">#icon-xiangqing16X16px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-jibenxinxi30X30pxxuanzhong"></use>
</svg>
<div class="name">基本信息30X30px.选中</div>
<div class="code-name">#icon-a-jibenxinxi30X30pxxuanzhong</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-yushouxin30X30pxxuanzhong"></use>
</svg>
<div class="name">预授信30X30px.选中</div>
<div class="code-name">#icon-a-yushouxin30X30pxxuanzhong</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-jibenxinxi30X30px"></use>
</svg>
<div class="name">基本信息30X30px</div>
<div class="code-name">#icon-jibenxinxi30X30px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-shenfenhecha30X30px"></use>
</svg>
<div class="name">身份核查30X30px</div>
<div class="code-name">#icon-shenfenhecha30X30px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-yingxiangcaiji30X30pxyixuan"></use>
</svg>
<div class="name">影像采集30X30px.已选</div>
<div class="code-name">#icon-a-yingxiangcaiji30X30pxyixuan</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-yushouxin30X30px"></use>
</svg>
<div class="name">预授信30X30px</div>
<div class="code-name">#icon-yushouxin30X30px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-yingxiangcaiji30X30px"></use>
</svg>
<div class="name">影像采集30X30px</div>
<div class="code-name">#icon-yingxiangcaiji30X30px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-xiugai16X16px"></use>
</svg>
<div class="name">修改16X16px</div>
<div class="code-name">#icon-xiugai16X16px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-shenfenhecha30X30pxxuanzhong"></use>
</svg>
<div class="name">身份核查30X30px.选中</div>
<div class="code-name">#icon-a-shenfenhecha30X30pxxuanzhong</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-dingwei40X40px"></use>
</svg>
<div class="name">定位40X40px</div>
<div class="code-name">#icon-dingwei40X40px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-guanbi20X20px"></use>
</svg>
<div class="name">关闭20X20px</div>
<div class="code-name">#icon-guanbi20X20px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-renxiang24X24px"></use>
</svg>
<div class="name">人像24X24px</div>
<div class="code-name">#icon-renxiang24X24px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-xinzeng30X30px"></use>
</svg>
<div class="name">新增30X30px</div>
<div class="code-name">#icon-xinzeng30X30px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-jiaoseqiehuan32x32px"></use>
</svg>
<div class="name">角色切换32x32px</div>
<div class="code-name">#icon-jiaoseqiehuan32x32px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-shezhi32x32px"></use>
</svg>
<div class="name">设置32x32px</div>
<div class="code-name">#icon-shezhi32x32px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-wangdianchaxun32x32px"></use>
</svg>
<div class="name">网点查询32x32px</div>
<div class="code-name">#icon-wangdianchaxun32x32px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-chanpinzhongxin32x32px"></use>
</svg>
<div class="name">产品中心32x32px</div>
<div class="code-name">#icon-chanpinzhongxin32x32px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-xuexipeixun32x32px"></use>
</svg>
<div class="name">学习培训32x32px</div>
<div class="code-name">#icon-xuexipeixun32x32px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-xinxicaiji32x32px"></use>
</svg>
<div class="name">信息采集32x32px</div>
<div class="code-name">#icon-xinxicaiji32x32px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-fuzhugongju32x32px"></use>
</svg>
<div class="name">辅助工具32x32px</div>
<div class="code-name">#icon-fuzhugongju32x32px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-mianduimianyingxiao32x32px"></use>
</svg>
<div class="name">面对面营销32x32px</div>
<div class="code-name">#icon-mianduimianyingxiao32x32px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-shouxinguanli32x32px"></use>
</svg>
<div class="name">授信管理32x32px</div>
<div class="code-name">#icon-shouxinguanli32x32px</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-pingjiguanli32x32px"></use>
</svg>
<div class="name">评级管理32x32px</div>
<div class="code-name">#icon-pingjiguanli32x32px</div>
</li>
</ul>
<div class="article markdown">
<h2 id="symbol-">Symbol 引用</h2>
<hr>
<p>这是一种全新的使用方式，应该说这才是未来的主流，也是平台目前推荐的用法。相关介绍可以参考这篇<a href="">文章</a>
这种用法其实是做了一个 SVG 的集合，与另外两种相比具有如下特点：</p>
<ul>
<li>支持多色图标了，不再受单色限制。</li>
<li>通过一些技巧，支持像字体那样，通过 <code>font-size</code>, <code>color</code> 来调整样式。</li>
<li>兼容性较差，支持 IE9+，及现代浏览器。</li>
<li>浏览器渲染 SVG 的性能一般，还不如 png。</li>
</ul>
<p>使用步骤如下：</p>
<h3 id="-symbol-">第一步：引入项目下面生成的 symbol 代码：</h3>
<pre><code class="language-html"><script src="./iconfont.js"></script>
</code></pre>
<h3 id="-css-">第二步：加入通用 CSS 代码（引入一次就行）：</h3>
<pre><code class="language-html"><style>
.icon {
width: 1em;
height: 1em;
vertical-align: -0.15em;
fill: currentColor;
overflow: hidden;
}
</style>
</code></pre>
<h3 id="-">第三步：挑选相应图标并获取类名，应用于页面：</h3>
<pre><code class="language-html"><svg class="icon" aria-hidden="true">
<use xlink:href="#icon-xxx"></use>
</svg>
</code></pre>
</div>
</div>
</div>
</div>
<script>
$(document).ready(function () {
$('.tab-container .content:first').show()
$('#tabs li').click(function (e) {
var tabContent = $('.tab-container .content')
var index = $(this).index()
if ($(this).hasClass('active')) {
return
} else {
$('#tabs li').removeClass('active')
$(this).addClass('active')
tabContent.hide().eq(index).fadeIn()
}
})
})
</script>
</body>
</html>