# IconFont 图标

- 编译
  #amosicon-compile
- 下一页
  #amosicon-next-page
- 左上
  #amosicon-arrow-left-top-thin
- favorite
  #amosicon-favorite1
- left
  #amosicon-left
- 用户
  #amosicon-user1
- 邮箱
  #amosicon-youxiang
- 上一页
  #amosicon-pre-page
- 下拉
  #amosicon-xiala
- 添加
  #amosicon-add2
- list
  #amosicon-list-dot
- delete
  #amosicon-delete
- 退出
  #amosicon-tuichu
- 文件上传
  #amosicon-file-upload-2
- 注销
  #amosicon-zhuxiao4
- 邮箱
  #amosicon-youxiang1
- 单位
  #amosicon-danwei
- 刷新
  #amosicon-refresh
- 更多
  #amosicon-gengduo
- down
  #amosicon-down
- chart pie
  #amosicon-pie-chart
- user
  #amosicon-user
- picture
  #amosicon-picture
- 视频
  #amosicon-video1
- folder
  #amosicon-folder
- selected
  #amosicon-selected
- ViewGallery
  #amosicon-viewgallery
- Select all
  #amosicon-selectall
- list
  #amosicon-list1
- eye
  #amosicon-eye
- right
  #amosicon-right
- up
  #amosicon-up
- 视频播放
  #amosicon-shipinbofang
- 消息
  #amosicon-xiaoxi
- 选中
  #amosicon-xuanzhong
- 消息
  #amosicon-message
- area-chart
  #amosicon-area-chart
- 添加
  #amosicon-tianjia2
- 视频
  #amosicon-shipin
- python
  #amosicon-python
- 声音
  #amosicon-shengyin
- 消息
  #amosicon-xiaoxi2
- question
  #amosicon-question
- auto
  #amosicon-auto
- task
  #amosicon-task
- atm-away
  #amosicon-atmaway
- cross
  #amosicon-cross
- fire
  #amosicon-fire-fat
- 工具
  #amosicon-tools-2
- 消息
  #amosicon-message-1
- pin
  #amosicon-pin
- 文件夹
  #amosicon-wenjianjia
- full-screen
  #amosicon-full-screen
- 消息
  #amosicon-tubiao15
- 上传视频
  #amosicon-shangchuanshipin
- warning
  #amosicon-warning
- 上传文件
  #amosicon-file-upload-3
- application
  #amosicon-application-1
- link
  #amosicon-link
- menu-unfold
  #amosicon-fat-menu-unfold
- menu-fold
  #amosicon-fat-menu-fold
- 选中
  #amosicon-xuanzhong1
- 规范
  #amosicon-guifan
- bars
  #amosicon-bars
- bms_脚手架_库存
  #amosicon-scaffold-store
- 更多
  #amosicon-angle-more
- 脚手架管理
  #amosicon-scaffold
- notification
  #amosicon-notification
- picture
  #amosicon-picture1
- save
  #amosicon-save
- file
  #amosicon-file
- 放大
  #amosicon-zoom-in
- success
  #amosicon-success
- new-window
  #amosicon-window
- 移除
  #amosicon-remove
- 选中
  #amosicon-xuanzhong2
- 注销
  #amosicon-zhuxiao
- arrow-down-right
  #amosicon-down-right-arrow
- folder-open
  #amosicon-folder-open
- tree
  #amosicon-tree
- warning
  #amosicon-danger
- phone
  #amosicon-phone
- 帮助
  #amosicon-help
- 回到顶部
  #amosicon-huidaodingbu
- subdirectory_arrow_right
  #amosicon-entry-sub-graph
- 添加
  #amosicon-tianjia1
- rightBottom_02
  #amosicon-right-bottom
- 视频播放
  #amosicon-shipinbofang1
- 选中
  #amosicon-check
- 退出
  #amosicon-exit-3d
- 指南
  #amosicon-zhinan
- list
  #amosicon-list11
- 选中
  #amosicon-xuanzhong3
- WorkflowDesign
  #amosicon-workflow-design
- WorkflowMonitoring
  #amosicon-workflow-monitor
- task
  #amosicon-task-2
- wxb报表
  #amosicon-wxbbaobiao
- wxb工具
  #amosicon-wxbgongju
- wxb搜索推广
  #amosicon-wxbsousuotuiguang
- wxb定位
  #amosicon-wxbdingwei
- setting
  #amosicon-setting
- favorite
  #amosicon-favorite
- icon-toTop
  #amosicon-icontotop
- copy
  #amosicon-copy
- 更多
  #amosicon-gengduo-copy
- 操作指南
  #amosicon-caozuo
- test
  #amosicon-test
- 标签1
  #amosicon-label
- 移除
  #amosicon-yichu
- 工具
  #amosicon-tools
- 首页-首页
  #amosicon-shouye1
- 注销
  #amosicon-zhuxiao1
- 回到顶部
  #amosicon-huidaodingbu1
- home
  #amosicon-home
- close
  #amosicon-close
- 是的_right149
  #amosicon-down-right
- ok
  #amosicon-ok
- 首页
  #amosicon-shouye
- 上传文件
  #amosicon-file-upload
- 退出
  #amosicon-exit-fat
- tree
  #amosicon-tree1
- setting
  #amosicon-setting1
- 回到顶部
  #amosicon-huidaodingbu2
- 视频
  #amosicon-shipin1
- info
  #amosicon-info
- toTop
  #amosicon-totop
- paper-clip
  #amosicon-paper-clip
- play-video-button
  #amosicon-playvideobutton
- file
  #amosicon-file-lef
- 字符
  #amosicon-char
- 选中
  #amosicon-xuanzhong4
- task
  #amosicon-task-1
- 上传文件
  #amosicon-shangchuanwenjian
- 订单关闭
  #amosicon-dingdanguanbi
- 上传视频
  #amosicon-video-upload
- 声音
  #amosicon-voice
- 指引
  #amosicon-zhiyin
- icon_menu_fold_30x30
  #amosicon-sim-menu-fold
- 选中
  #amosicon-selected-1
- 说明
  #amosicon-shuoming
- hot
  #amosicon-hot
- 打包
  #amosicon-dabao
- history
  #amosicon-history
- html
  #amosicon-html-copy
- icon_menu_unfold_30x30
  #amosicon-sim-menu-unfold
- 入门篇
  #amosicon-rumenpian
- 环境
  #amosicon-huanjing
- data
  #amosicon-data
- 通用类_添加视图
  #amosicon-add-sub-view
- 定制
  #amosicon-dingzhi
- error
  #amosicon-error
- 选中
  #amosicon-xuanzhong7
- 移除
  #amosicon-yichu1
- 更多
  #amosicon-gengduo1
- edit
  #amosicon-edit
- folder-close
  #amosicon-folder-close
- 皮肤
  #amosicon-skin
- workflow
  #amosicon-workflow
- tree
  #amosicon-single-tree
- good
  #amosicon-good
- template
  #amosicon-template
- 减号
  #amosicon-jianhao
- themeisle
  #amosicon-themeisle
- 资源借用
  #amosicon-ziyuanjieyong
- npm
  #amosicon-npm
- 左箭头
  #amosicon-arrow-left
- 返回
  #amosicon-fanhui
- 列-表
  #amosicon-list
- 向下 Down 1000
  #amosicon-i-down
- 更多
  #amosicon-gengduo2
- 业务
  #amosicon-business
- 工程管理
  #amosicon-prj-mgmt
- ray
  #amosicon-ray
- 三道杠无填充
  #amosicon-sandaogangwutianchong
- 上传视频
  #amosicon-shangchuanshipin2
- desktop on-line statistics
  #amosicon-online-check
- 返回
  #amosicon-fanhui1
- file-tree
  #amosicon-file-tree
- 穿梭框
  #amosicon-chuansuokuang
- eye-o
  #amosicon-eye-o
- sass
  #amosicon-sass
- qr-code
  #amosicon-qr-code
- 关闭-半角
  #amosicon-guanbi
- 移除
  #amosicon-jinrongtubiao_yichu
- ruby
  #amosicon-ruby
- 退出
  #amosicon-exit
- 报警
  #amosicon-alarm-tip-single
- chart-bar
  #amosicon-bar-chart
- 工具
  #amosicon-tools-1
- 移除
  #amosicon-yichu2
- 定制
  #amosicon-dingzhi1
- 详情consult
  #amosicon-tuwen_ic_data
- menu-unfold
  #amosicon-thin-menu-unfold
- 规范
  #amosicon-standard
- success
  #amosicon-success-single
- 环境
  #amosicon-env
- 符号-文档
  #amosicon-wendang
- history
  #amosicon-history-logs
- 基 础管理
  #amosicon-basic-coms
- 添加数据源
  #amosicon-database
- 隐藏列
  #amosicon-hide
- edit
  #amosicon-bianji
- input
  #amosicon-luru
- enty-out-storage
  #amosicon-querenchuku
- setting
  #amosicon-shezhi
- 注销
  #amosicon-zhuxiao2
- 定制
  #amosicon-dingzhi2
- vue
  #amosicon-vuejs
- 表格
  #amosicon-i-table
- cancel
  #amosicon-cancel
- java
  #amosicon-java
- 更新日志
  #amosicon-update-log
- 报警
  #amosicon-alarm-tip
- 基础
  #amosicon-basic
- 注销
  #amosicon-zhuxiao3
- template
  #amosicon-template-copy
- appStore
  #amosicon-appstore
- video
  #amosicon-video
- 入库
  #amosicon-ccgl-rukuyugao-8
- 出库
  #amosicon-ccgl-chukucaozuo-13
- html
  #amosicon-html
- 选中
  #amosicon-angle-selected
- Application
  #amosicon-application
- 收 藏
  #amosicon-collection
- 指引
  #amosicon-zhiyin1
- 信封
  #amosicon-xinfeng
- 图表
  #amosicon-tubiao
- 单位
  #amosicon-danwei1
- 卡片
  #amosicon-card
- Webpack
  #amosicon-webpack-1
- code
  #amosicon-code-hide
- password
  #amosicon-password
- 条纹码 条形码 条码
  #amosicon-bar-code
- close
  #amosicon-close-circle
- fire
  #amosicon-fire-thin
- 数据表格2
  #amosicon-data-table
- code
  #amosicon-code-show
- enzyme
  #amosicon-enzyme
- 回到顶部
  #amosicon-huidaodingbu-copy
- 视频上传
  #amosicon-shipinshangchuan
- js
  #amosicon-js
- 减
  #amosicon-minus-square
- 右箭头
  #amosicon-arrow-right
- 检查
  #amosicon-jiancha
- 右下箭头
  #amosicon-right-bottom-arrow
- table
  #amosicon-table
- gulp
  #amosicon-gulp
- react
  #amosicon-react
- sass
  #amosicon-sass-1
- 左上箭头
  #amosicon-arrow-left-top
- tags
  #amosicon-tags
- 组件库
  #amosicon-component-lib
- add
  #amosicon-add
- initiate-assistance
  #amosicon-initiate-assistance
- 维修记录
  #amosicon-weixiujilu
- 火
  #amosicon-fire
- 交互
  #amosicon-jiaohu-1
- 交互随即查询
  #amosicon-jiaohu
- 公文范例库
  #amosicon-store
- postcss
  #amosicon-postcss
- webpack
  #amosicon-webpack
- 新增知识库
  #amosicon-add-knowledge
- 重命名
  #amosicon-re-edit
- 操作指南
  #amosicon-guide
- 交互图标
  #amosicon-hudong
- 右上
  #amosicon-arrow-right-top-fat
- caret-right
  #amosicon-caret-right
- 首页
  #amosicon-home-1
- menu fold
  #amosicon-thin-menu-fold
- 业务
  #amosicon-biz
- list
  #amosicon-list-rect
- table
  #amosicon-table-1
- react
  #amosicon-react-1
- 右斜上箭头
  #amosicon-arrow-right-top
- more
  #amosicon-number-more
- 文档
  #amosicon-doc
- 开发环境
  #amosicon-develop-env-1
- 日期
  #amosicon-date
- 开发环境
  #amosicon-develop-env
- search
  #amosicon-search
- 缩小
  #amosicon-zoom-out
- 井
  #amosicon-number
- qr-code
  #amosicon-qr-code1
- open-in-new
  #amosicon-open-in-new

## 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="#amosicon-xxx"></use>
    </svg>