# IconFont 图标

- 下一页
  #amosicon-next-page
- 左上
  #amosicon-arrow-left-top-thin
- favorite
  #amosicon-favorite1
- left
  #amosicon-left
- 用户
  #amosicon-icon
- 邮箱
  #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-gengduo
- down
  #amosicon-down
- picture
  #amosicon-picture
- 视频
  #amosicon-video1
- folder
  #amosicon-folder
- selected
  #amosicon-selected
- ViewGallery
  #amosicon-viewgallery
- list
  #amosicon-list
- right
  #amosicon-right
- up
  #amosicon-up
- 视频播放
  #amosicon-shipinbofang
- 消息
  #amosicon-xiaoxi
- 选中
  #amosicon-xuanzhong
- 消息
  #amosicon-message
- 添加
  #amosicon-tianjia2
- 视频
  #amosicon-shipin
- 声音
  #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-tianqi-yintian
- 消息
  #amosicon-message-1
- pin
  #amosicon-pin
- 文件夹
  #amosicon-wenjianjia
- 消息
  #amosicon-tubiao15
- 上传视频
  #amosicon-shangchuanshipin
- warning
  #amosicon-warning
- 上传文件
  #amosicon-file-upload-3
- 选中
  #amosicon-xuanzhong1
- 更多
  #amosicon-angle-more
- picture
  #amosicon-picture1
- success
  #amosicon-success
- 移除
  #amosicon-remove
- 选中
  #amosicon-xuanzhong2
- 注销
  #amosicon-zhuxiao
- warning
  #amosicon-danger
- phone
  #amosicon-phone
- 帮助
  #amosicon-help
- 回到顶部
  #amosicon-huidaodingbu
- 添加
  #amosicon-tianjia1
- 视频播放
  #amosicon-shipinbofang1
- number
  #amosicon-number-1
- 选中
  #amosicon-check
- list
  #amosicon-list1
- 选中
  #amosicon-xuanzhong3
- task
  #amosicon-task-2
- wxb报表
  #amosicon-wxbbaobiao
- wxb工具
  #amosicon-wxbgongju
- wxb搜索推广
  #amosicon-wxbsousuotuiguang
- wxb定位
  #amosicon-wxbdingwei
- favorite
  #amosicon-favorite
- icon-toTop
  #amosicon-icontotop
- copy
  #amosicon-copy
- 更多
  #amosicon-gengduo-copy
- 标签1
  #amosicon-label
- 移除
  #amosicon-yichu
- 首页-首页
  #amosicon-shouye
- 注销
  #amosicon-zhuxiao1
- 回到顶部
  #amosicon-huidaodingbu1
- close
  #amosicon-close
- 上传文件
  #amosicon-file-upload
- setting
  #amosicon-setting
- 回到顶部
  #amosicon-huidaodingbu2
- 视频
  #amosicon-shipin1
- info
  #amosicon-info
- toTop
  #amosicon-totop
- paper-clip
  #amosicon-paper-clip
- play-video-button
  #amosicon-playvideobutton
- 选中
  #amosicon-xuanzhong4
- task
  #amosicon-task-1
- 上传文件
  #amosicon-shangchuanwenjian
- 订单关闭
  #amosicon-dingdanguanbi
- 上传视频
  #amosicon-video-upload
- 声音
  #amosicon-voice
- 天气_暴雪
  #amosicon-tianqi-baoxue
- 天气_冰雹
  #amosicon-tianqi-bingbao
- 天气_风暴
  #amosicon-tianqi-fengbao
- 天气_雷阵雨
  #amosicon-tianqi-leizhenyu
- 天气_小雪
  #amosicon-tianqi-xiaoxue
- 天气_小雨
  #amosicon-tianqi-xiaoyu
- 天气_阵雪
  #amosicon-tianqi-zhenxue
- 天气_阵雨
  #amosicon-tianqi-zhenyu
- 天气_中雪
  #amosicon-tianqi-zhongxue
- 天气_中雨
  #amosicon-tianqi-zhongyu
- 选中
  #amosicon-selected-1
- 说明
  #amosicon-shuoming
- hot
  #amosicon-hot
- data
  #amosicon-data
- error
  #amosicon-error
- 选中
  #amosicon-xuanzhong7
- 移除
  #amosicon-yichu1
- 更多
  #amosicon-gengduo1
- 皮肤
  #amosicon-skin
- good
  #amosicon-good
- 减号
  #amosicon-jianhao
- themeisle
  #amosicon-themeisle
- 资源借用
  #amosicon-ziyuanjieyong
- 左箭头
  #amosicon-arrow-left
- 返回
  #amosicon-fanhui
- 列-表
  #amosicon-bars
- 更多
  #amosicon-gengduo2
- 上传视频
  #amosicon-shangchuanshipin2
- 返回
  #amosicon-fanhui1
- eye-o
  #amosicon-eye-o
- number0
  #amosicon-number-0
- number6
  #amosicon-number-6
- number2
  #amosicon-number-2
- number4
  #amosicon-number-4
- number3
  #amosicon-number-3
- number7
  #amosicon-number-7
- number8
  #amosicon-number-8
- number5
  #amosicon-number-5
- number9
  #amosicon-number-9
- number10
  #amosicon-number-10
- 关闭-半角
  #amosicon-guanbi
- 移除
  #amosicon-jinrongtubiao_yichu
- 报警
  #amosicon-alarm-tip-single
- number
  #amosicon-number-jing
- 移除
  #amosicon-yichu2
- 详情consult
  #amosicon-tuwen_ic_data
- success
  #amosicon-success-single
- 注销
  #amosicon-zhuxiao2
- 报警
  #amosicon-alarm-tip
- 注销
  #amosicon-zhuxiao3
- appStore
  #amosicon-appstore
- video
  #amosicon-video
- 入库
  #amosicon-ccgl-rukuyugao-8
- 出库
  #amosicon-ccgl-chukucaozuo-13
- 选中
  #amosicon-angle-selected
- 收 藏
  #amosicon-collection
- 信封
  #amosicon-xinfeng
- 单位
  #amosicon-danwei1
- 卡片
  #amosicon-card
- code
  #amosicon-code-hide
- password
  #amosicon-password
- close
  #amosicon-close-circle
- fire
  #amosicon-fire-thin
- code
  #amosicon-code-show
- 晴-天气
  #amosicon-tianqi-qing
- 天气_大风
  #amosicon-tianqi-dafeng
- 天气_大雪
  #amosicon-tianqi-daxue
- 天气_雷
  #amosicon-tianqi-lei
- 天气_雨夹雪
  #amosicon-tianqi-yujiaxue
- 天气_大雨
  #amosicon-tianqi-dayu
- 回到顶部
  #amosicon-huidaodingbu-copy
- 视频上传
  #amosicon-shipinshangchuan
- 减
  #amosicon-minus-square
- 右箭头
  #amosicon-arrow-right
- 检查
  #amosicon-jiancha
- table
  #amosicon-table
- 左上箭头
  #amosicon-arrow-left-top
- 天气
  #amosicon-tianqi-qingzhuanduoyun
- add
  #amosicon-add
- 维修记录
  #amosicon-weixiujilu
- 火
  #amosicon-fire
- 右上
  #amosicon-arrow-right-top-fat
- caret-right
  #amosicon-caret-right
- list
  #amosicon-list-rect
- table
  #amosicon-table-1
- 右斜上箭头
  #amosicon-arrow-right-top
- more
  #amosicon-number-more
- search
  #amosicon-search
- qr-code
  #amosicon-qr-code

## 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>