# IconFont 图标

- 收藏夹
  .icon-shoucangjia
- 店铺
  .icon-dianpu
- 定位
  .icon-dingwei
- 手表
  .icon-shoubiao
- favor
  .icon-favor
- location_fill
  .icon-locationfill
- location
  .icon-location
- phone
  .icon-phone
- search
  .icon-search
- taxi
  .icon-taxi
- time_fill
  .icon-timefill
- time
  .icon-time
- camera
  .icon-camera
- comment_fill
  .icon-commentfill
- comment
  .icon-comment
- like_fill
  .icon-likefill
- like
  .icon-like
- notification_fill
  .icon-notificationfill
- pay
  .icon-pay
- send
  .icon-send
- shop
  .icon-shop
- ticket
  .icon-ticket
- back
  .icon-back
- shop_fill
  .icon-shopfill
- footprint
  .icon-footprint
- right
  .icon-right
- cart
  .icon-cart
- delete
  .icon-delete
- home
  .icon-home
- 搜索
  .icon-tubiaozitihua11
- 用户
  .icon-yonghu
- sort
  .icon-sort
- qq
  .icon-qq
- 生活
  .icon-shenghuo
- 居家
  .icon-jujia
- 修改
  .icon-modify
- 返回
  .icon-shiliangzhinengduixiang4
- 提示
  .icon-icontishi
- people
  .icon-people
- repair
  .icon-repair
- 修改
  .icon-xiugai
- 顺序
  .icon-shunxu
- 微信
  .icon-weixin
- 分享
  .icon-iconfontfenxiang3
- 密码
  .icon-mima
- 删除
  .icon-shanchu
- 排序1
  .icon-paixu1
- 赞
  .icon-zan
- 微博
  .icon-weibo
- 化妆品
  .icon-huazhuangpin
- 排序箭头D
  .icon-paixujiantoud-copy
- QQ客服
  .icon-qqkefu
- 提示-fill
  .icon-tishifill
- 提示
  .icon-tishi
- 圆形选中-fill
  .icon-yuanxingxuanzhongfill
- 圆形选中
  .icon-yuanxingxuanzhong
- 标星-fill
  .icon-biaoxingfill
- 标星
  .icon-biaoxing
- 店铺
  .icon-dianpu1
- 购物车-fill
  .icon-gouwuchefill
- 购物车
  .icon-gouwuche
- 优惠券
  .icon-youhuiquan
- 心
  .icon-xin
- 心
  .icon-heart
- 购物车
  .icon-gouwuche1
- 垃圾箱
  .icon-lajixiang
- 设置
  .icon-shezhi
- 收货地址
  .icon-shouhuodizhi
- 我的订单
  .icon-wodedingdan
- 我的优惠券
  .icon-wodeyouhuiquan
- 向上箭头
  .icon-xiangshangjiantou
- 向下箭头
  .icon-xiangxiajiantou
- 向右箭头
  .icon-xiangyoujiantou
- 向左箭头
  .icon-xiangzuojiantou
- 眼睛
  .icon-yanjing
- 意见反馈
  .icon-yijianfankui
- 消息中心
  .icon-xiaoxizhongxin
- 多语言
  .icon-duoyuyan
- 飞机
  .icon-feiji
- 健身
  .icon-jianshen
- 钱
  .icon-qian
- 无线网络
  .icon-wuxianwangluo
- 24小时前台
  .icon-24xiaoshiqiantai
- 电话
  .icon-dianhua
- 排序箭头U
  .icon-up
- 上升
  .icon-shangsheng
- 下降
  .icon-xiajiang
- 筛选
  .icon-shaixuan
- 国际物流
  .icon-guojiwuliu
- 户外
  .icon-huwai
- 居家
  .icon-jujia1
- 裤子
  .icon-kuzi
- 母婴
  .icon-muying
- 男装
  .icon-nanzhuang
- 内衣
  .icon-neiyi
- 女装
  .icon-nvzhuang
- 品牌
  .icon-pinpai
- 特权专属
  .icon-tequanzhuanshu
- 箱包
  .icon-xiangbao
- 7
  .icon-7
- 免
  .icon-mian
- 机构信息
  .icon-jigouxinxi
- 箭头
  .icon-top-trigle-copy
- 箭头
  .icon-jiantou-copy
- 预告
  .icon-yugao
- 校验正确
  .icon-xiaoyanzhengque
- 微博
  .icon-weibo1
- 搜索-搜索
  .icon-sousuo-sousuo
- 向下排序
  .icon-xiangxiapaixu
- 正确
  .icon-zhengque-copy
- 向下排序
  .icon-xiangxiapaixu1
- 排序
  .icon-sort-small
- 倒计时
  .icon-daojishi
- 信息
  .icon-dingbudaohangxinxi
- 排序-向下
  .icon-sortdown
- socialshare
  .icon-socialshare
- we_fill_light
  .icon-we_fill_light
- 支付宝
  .icon-zhifubao
- 修改
  .icon-weibiaoti--
- 排序
  .icon-pc-sort-up-copy-down
- 修改
  .icon-xiugai1

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