# IconFont 图标

- 失败
  .bcui-icon-information-fail
- 提示
  .bcui-icon-icon
- topic
  .bcui-icon-topic1
- refresh
  .bcui-icon-refresh-single
- 点点
  .bcui-icon-setting-more
- 收藏
  .bcui-icon-shoucang
- 日志
  .bcui-icon-topic
- 加
  .bcui-icon-jia
- 减号
  .bcui-icon-jian
- calendar
  .bcui-icon-calendar
- check
  .bcui-icon-check
- alert
  .bcui-icon-alert
- blocks
  .bcui-icon-blocks
- activated
  .bcui-icon-activated
- chevron-right
  .bcui-icon-chevron-right
- chevron-left
  .bcui-icon-chevron-left
- calculator
  .bcui-icon-calculator
- cloud
  .bcui-icon-cloud
- chevron-top
  .bcui-icon-chevron-top
- collapse
  .bcui-icon-collapse
- chevron-bottom
  .bcui-icon-chevron-bottom
- computer-filled
  .bcui-icon-computer-filled
- computer
  .bcui-icon-computer
- confirm
  .bcui-icon-confirm
- disk
  .bcui-icon-disk
- copy
  .bcui-icon-copy
- hardware-filled
  .bcui-icon-hardware-filled
- expand
  .bcui-icon-expand
- error
  .bcui-icon-error
- full
  .bcui-icon-full
- hardware
  .bcui-icon-hardware
- info
  .bcui-icon-info
- loading
  .bcui-icon-loading
- minus
  .bcui-icon-minus
- mirror
  .bcui-icon-mirror
- nodes
  .bcui-icon-nodes
- network-filled
  .bcui-icon-network-filled
- overview-filled
  .bcui-icon-overview-filled
- overview
  .bcui-icon-overview
- network
  .bcui-icon-network
- pencil
  .bcui-icon-pencil
- refresh
  .bcui-icon-refresh
- power-off
  .bcui-icon-power-off
- plus
  .bcui-icon-plus
- search
  .bcui-icon-search
- security-filled
  .bcui-icon-security-filled
- stop
  .bcui-icon-stop
- security
  .bcui-icon-security
- start
  .bcui-icon-start
- setting-filled
  .bcui-icon-setting-filled
- setting
  .bcui-icon-setting
- storage-filled
  .bcui-icon-storage-filled
- terminal
  .bcui-icon-terminal
- storage
  .bcui-icon-storage
- times
  .bcui-icon-times
- triangle-bottom
  .bcui-icon-triangle-bottom
- trash
  .bcui-icon-trash
- triangle-top
  .bcui-icon-triangle-top

## 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 bcui-icon-xxx"></i>

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