IconFont 图标

• 网络
  .icon-wangluo
• 组件分析
  .icon-zujianfenxi
• ECS
  .icon-ecs
• 网络
  .icon-msnui-tree-map
• 云存储
  .icon-yuncunchu
• 安全
  .icon-anquan
• VPN
  .icon-vpn
• 日志
  .icon-rizhi
• 负载均衡
  .icon-fuzaijunheng
• gateway-or
  .icon-gatewayor
• gateway-xor
  .icon-gatewayxor
• vpc
  .icon-vpc
• 弹性公网 IP EIP
  .icon-icon
• 网络
  .icon-iconset0280
• NAT策略
  .icon-natcelve
• 网络
  .icon-wangluo-copy
• 镜像
  .icon-copy-16
• VPN
  .icon-vpn1
• EIP
  .icon-13
• 负载均衡
  .icon-fuzaijunheng38
• 快照
  .icon-kuaizhao
• 实例
  .icon-instance
• 证书
  .icon-zhengshu
• 磁盘
  .icon-ecs-disk
• 高速通道
  .icon-gaosutongdao39
• 安全
  .icon-anquan1
• 安全
  .icon-webicon203
• 快照
  .icon-kuaizhao1
• eip
  .icon-eip
• ecs
  .icon-ecs1
• 网络
  .icon-wangluo1
• 证书
  .icon-zhengshu1
• 云服务器 ECS-无框
  .icon-yunfuwuqiecs33ccff
• 网络
  .icon-wangluo2
• 网络
  .icon-wangluo3
• 网络
  .icon-wangluo4
• nat
  .icon-nat
• ecs
  .icon-ecs2
• gateway
  .icon-gateway
• 镜像
  .icon-jingxiang
• 日志
  .icon-rizhi1
• eip
  .icon-danxinggongwangIPEIP
• 快照
  .icon-kuaizhao2
• 证书
  .icon-zhengshu1-copy
• 日志
  .icon-rizhi2
• vpc
  .icon-siyouwangluoVPC
• 桌面视频
  .icon-zhuomianshipin
• 网络
  .icon-wangluo5
• 网络
  .icon-wangluo6
• 快照
  .icon-kuaizhao3
• 实例列表
  .icon-shililiebiao
• 网络
  .icon-wangluo7
• ecs
  .icon-xingzhuangkaobei
• EPC左导航图标-VPC
  .icon-EPCzuodaohangtubiao-
• 镜像
  .icon-image
• 高速通道
  .icon-gaosutongdao
• VPN
  .icon-p_VPN
• VPN
  .icon-VPN
• svpc_subnet
  .icon-svpc_subnet
• svpc_getway
  .icon-svpc_getway
• svpc_safezone
  .icon-svpc_safezone
• vpn
  .icon-vpn2
• 安全
  .icon-anquan2
• 安全
  .icon-cloud-safety
• 镜像仓库
  .icon-jingxiangcangku
• VPN
  .icon-aistubiaozhizuo-
• 网络
  .icon-dianyinwangwangluojinrong
• 虚拟磁盘
  .icon-xunicipan
• 网络
  .icon-wangluo8
• 网络
  .icon-internet-other
• 安全
  .icon-anquan3
• 高速通道
  .icon-gaosutongdao1
• 专有网络 VPC
  .icon-zhuanyouwangluoVPC
• NAT 网关
  .icon-NATwangguan
• 网关
  .icon-gateway1
• 专有网络 VPC
  .icon-zhuanyouwangluoVPC1
• 私有网络vpc
  .icon-icon-test
• 桌面
  .icon-zhuomian
• 证书
  .icon-zhengshu2
• 媒体
  .icon-meiti
• 云存储
  .icon-yuncunchu1
• 媒体
  .icon-meiti1
• 负载均衡
  .icon-fuzaijunheng1
• 快照
  .icon-kuaizhao4
• 镜像
  .icon-jingxiang1
• 云存储
  .icon-yuncunchu2
• 云存储管理
  .icon-yuncunchuguanli
• 添加实例
  .icon-tianjiashili
• 磁盘列阵
  .icon-cipanliezhen
• Gateway
  .icon-Gateway
• 网关
  .icon-wangguan
• 组件icon_数据探索分析
  .icon-zujianicon_shujutansuofenxi
• 负载均衡
  .icon-fuzaijunheng2
• 网络
  .icon-wangluo9
• nat
  .icon-nat1
• 流程实例
  .icon-process-instance
• 磁盘
  .icon-cipan
• vpc网络
  .icon-vpcwangluo
• EIP弹性ip
  .icon-EIPdanxingip
• gateway
  .icon-gateway2

font-class引用

---

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

与unicode使用方式相比，具有如下特点：

• 兼容性良好，支持ie8+，及所有现代浏览器。
• 相比于unicode语意明确，书写更直观。可以很容易分辨这个icon是什么。
• 因为使用class来定义图标，所以当要替换图标时，只需要修改class里面的unicode引用。
• 不过因为本质上还是使用的字体，所以多色图标还是不支持的。

使用步骤如下：

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

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

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

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

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