# IconFont 图标

- 考试
  .icon-hegebiaozhun
- bar-chart
  .icon-bar-chart
- blog
  .icon-blog
- 收藏
  .icon-shoucang
- 书
  .icon-book-2
- 黑板-2
  .icon-blackboard-2
- 蜡笔
  .icon-crayons
- 奖杯
  .icon-cup
- abc
  .icon-abc
- 奖章
  .icon-medal
- 学位帽
  .icon-mortarboard-1
- 铅笔
  .icon-pencil-1
- 收藏
  .icon-shoucang1
- 考卷
  .icon-iconset-09
- 公告
  .icon-id-321
- 录播学习
  .icon-luboxuexi
- 思考，观察
  .icon-eye-vision-goal-plan-structure-define-think-watch-office-fcabecd
- 错题图标
  .icon-cuotitubiao
- 用户（女）
  .icon-user-girl
- 收藏
  .icon-shoucang2
- 编辑
  .icon-edit
- 地址
  .icon-position
- 设置
  .icon-set
- 用户（男）
  .icon-user-boy
- 电脑
  .icon-pc
- 收藏
  .icon-shoucang3
- 公告icon
  .icon-gonggaoicon
- business-color_board-30
  .icon-business-color_board-
- business-color_briefcase-24
  .icon-business-color_briefcase-
- media-color-1_camera-18
  .icon-media-color-_camera-
- objects-color_diamond
  .icon-objects-color_diamond
- objects-color_globe
  .icon-objects-color_globe
- shopping-color_cart-modern-in
  .icon-shopping-color_cart-modern-in
- tech-color_desktop
  .icon-tech-color_desktop
- tech-color_keyboard
  .icon-tech-color_keyboard
- tech-color_print
  .icon-tech-color_print
- 订单统计-01-01
  .icon-dingdantongji--

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