# IconFont 图标

- 账户
  #icon-zhanghu
- back
  #icon-back
- Category
  #icon-category
- comments
  #icon-comments
- delete
  #icon-delete
- edit
  #icon-edit
- favorite
  #icon-favorite
- form
  #icon-form
- help
  #icon-help
- information
  #icon-information
- less
  #icon-less
- more_unfold
  #icon-moreunfold
- more
  #icon-more
- pic
  #icon-pic
- QRCode
  #icon-qrcode
- refresh
  #icon-refresh
- search
  #icon-search
- set
  #icon-set
- success
  #icon-success
- ViewGallery
  #icon-viewgallery
- Viewlist
  #icon-viewlist
- wrong
  #icon-wrong
- add
  #icon-add
- github
  #icon-github
- remind
  #icon-remind
- attachment
  #icon-attachment
- discount
  #icon-discount
- gifts
  #icon-gifts
- lights
  #icon-lights
- jewelry
  #icon-jewelry
- link
  #icon-link
- text
  #icon-text
- remind
  #icon-remind1
- download
  #icon-icondownload
- file-audio
  #icon-fileaudio
- bad
  #icon-bad
- good
  #icon-good
- 信封
  #icon-iconfontunie62c
- 错号
  #icon-error-1
- 对号
  #icon-right-1
- 微信
  #icon-weixin
- QQ
  #icon-qq
- 字典
  #icon-zidian
- 更多
  #icon-gengduo
- 音频_audio47
  #icon-yinpinaudio47
- qq
  #icon-qq1
- 日历
  #icon-rili
- 用户 头像
  #icon-yonghutouxiang
- 文章管理02
  #icon-doc
- 微信
  #icon-weixin1
- 模板菜单
  #icon-mobancaidan
- 应用框架插件
  #icon-yingyongkuangjiachajian
- hot
  #icon-hot
- 通知
  #icon-icon_notice
- 资源库
  #icon-ziyuanku
- 视频
  #icon-shipin
- 密码
  #icon-mima
- 角色管理
  #icon-jiaoseguanli
- 文件
  #icon-wenjian
- 复制
  #icon-fuzhi
- 机构
  #icon-institute
- 资源管理
  #icon-ziyuanguanli
- 统计
  #icon-tongji
- 首页
  #icon-shouye
- 素材
  #icon-sucai
- 导航-公众号设置
  #icon-daohang-gongzhonghaotixing
- 人员管理
  #icon-renyuanguanli
- 放大
  #icon-fangda
- 播放
  #icon-bofang
- 工作台
  #icon-gaiicon-
- camera
  #icon-camera
- 文章
  #icon-wenzhang

## symbol引用

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

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

使用步骤如下：

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

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

### 第二步：加入通用css代码（引入一次就行）：

    <style type="text/css">
    .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>