# 

- 
  all
  &#xe696;
- 
  back
  &#xe697;
- 
  cart
  &#xe698;
- 
  Category
  &#xe699;
- 
  close
  &#xe69a;
- 
  comments
  &#xe69b;
- 
  cry
  &#xe69c;
- 
  delete
  &#xe69d;
- 
  edit
  &#xe69e;
- 
  email
  &#xe69f;
- 
  favorite
  &#xe6a0;
- 
  form
  &#xe6a2;
- 
  help
  &#xe6a3;
- 
  information
  &#xe6a4;
- 
  less
  &#xe6a5;
- 
  more_unfold
  &#xe6a6;
- 
  more
  &#xe6a7;
- 
  pic
  &#xe6a8;
- 
  QRCode
  &#xe6a9;
- 
  refresh
  &#xe6aa;
- 
  RFQ
  &#xe6ab;
- 
  search
  &#xe6ac;
- 
  selected
  &#xe6ad;
- 
  set
  &#xe6ae;
- 
  Smile
  &#xe6af;
- 
  success
  &#xe6b1;
- 
  survey
  &#xe6b2;
- 
  training
  &#xe6b3;
- 
  ViewGallery
  &#xe6b4;
- 
  Viewlist
  &#xe6b5;
- 
  warning
  &#xe6b6;
- 
  wrong
  &#xe6b7;
- 
  account
  &#xe6b8;
- 
  add
  &#xe6b9;
- 
  atm
  &#xe6ba;
- 
  clock
  &#xe6bb;
- 
  remind
  &#xe6bc;
- 
  calendar
  &#xe6bf;
- 
  attachment
  &#xe6c0;
- 
  discount
  &#xe6c5;
- 
  service
  &#xe6c7;
- 
  print
  &#xe6c9;
- 
  box
  &#xe6cb;
- 
  process
  &#xe6ce;
- 
  beauty
  &#xe6d2;
- 
  electrical
  &#xe6d4;
- 
  home
  &#xe6d7;
- 
  electronics
  &#xe6da;
- 
  gifts
  &#xe6db;
- 
  lights
  &#xe6de;
- 
  sports
  &#xe6e0;
- 
  toys
  &#xe6e1;
- 
  auto
  &#xe6e3;
- 
  jewelry
  &#xe6e4;
- 
  trade-assurance
  &#xe6e5;
- 
  browse
  &#xe6e6;
- 
  rfq-qm
  &#xe6e7;
- 
  rfq-quantity
  &#xe6e8;
- 
  atm-away
  &#xe6e9;
- 
  rfq
  &#xe6eb;
- 
  scanning
  &#xe6ec;
- 
  compare
  &#xe6ee;
- 
  filter
  &#xe6f1;
- 
  pin
  &#xe6f2;
- 
  history
  &#xe6f3;
- 
  product-features
  &#xe6f4;
- 
  supplier-features
  &#xe6f5;
- 
  similar-product
  &#xe6f6;
- 
  link
  &#xe6f7;
- 
  cut
  &#xe6f8;
- 
  nav-list
  &#xe6fa;
- 
  image-text
  &#xe6fb;
- 
  text
  &#xe6fc;
- 
  move
  &#xe6fd;
- 
  subtract
  &#xe6fe;
- 
  dollar
  &#xe702;
- 
  raw
  &#xe704;
- 
  office
  &#xe705;
- 
  agriculture
  &#xe707;
- 
  machinery
  &#xe709;
- 
  assessed-Badge
  &#xe70a;
- 
  personal-center
  &#xe70b;
- 
  integral
  &#xe70c;
- 
  operation
  &#xe70e;
- 
  remind
  &#xe713;
- 
  download
  &#xe714;
- 
  map
  &#xe715;
- 
  iconfont-5
  &#xe63a;
- 
  bad
  &#xe716;
- 
  good
  &#xe717;
- 
  skip
  &#xe718;
- 
  play
  &#xe719;
- 
  stop
  &#xe71a;
- 
  compass
  &#xe71b;
- 
  security
  &#xe71c;
- 
  share
  &#xe71d;
- 
  store
  &#xe722;
- 
  manage-order
  &#xe723;
- 
  rejected-order
  &#xe724;
- 
  phone
  &#xe725;
- 
  bussiness-man
  &#xe726;
- 
  shoes
  &#xe728;
- 
  Mobile-phone
  &#xe72a;
- 
  email-filling
  &#xe72d;
- 
  favorites-filling
  &#xe730;
- 
  account-filling
  &#xe732;
- 
  wechat
  &#xe644;
- 
  credit-level
  &#xe735;
- 
  credit-level-filling
  &#xe736;
- 
  客服
  &#xe61a;
- 
  exl
  &#xe73f;
- 
  pdf
  &#xe740;
- 
  zip
  &#xe741;
- 
  购物车
  &#xe63f;
- 
  购物车添加
  &#xe640;
- 
  错误
  &#xe641;
- 
  二维码
  &#xe642;
- 
  聚收藏
  &#xe643;
- 
  垃圾箱
  &#xe645;
- 
  sorting
  &#xe743;
- 
  链接
  &#xe646;
- 
  闹钟
  &#xe648;
- 
  扫一扫
  &#xe649;
- 
  上翻
  &#xe64a;
- 
  设置
  &#xe64b;
- 
  声音
  &#xe64c;
- 
  时间
  &#xe64d;
- 
  收货地址
  &#xe64e;
- 
  首页
  &#xe64f;
- 
  刷新
  &#xe650;
- 
  搜索
  &#xe651;
- 
  锁
  &#xe652;
- 
  提示
  &#xe653;
- 
  完成
  &#xe654;
- 
  我的订单
  &#xe655;
- 
  我的反馈
  &#xe656;
- 
  我的红包
  &#xe657;
- 
  我的聚划算
  &#xe659;
- 
  我的优惠券
  &#xe65a;
- 
  下翻
  &#xe65b;
- 
  下拉
  &#xe65c;
- 
  向上箭头
  &#xe65d;
- 
  向下箭头
  &#xe65e;
- 
  向右箭头
  &#xe65f;
- 
  向左箭头
  &#xe660;
- 
  眼睛
  &#xe661;
- 
  意见反馈
  &#xe662;
- 
  照相机
  &#xe663;
- 
  正确
  &#xe664;
- 
  消息中心
  &#xe665;
- 
  另存为
  &#xe666;
- 
  火
  &#xe66c;
- 
  copy
  &#xe744;
- 
  save
  &#xe747;
- 
  inquiry-template
  &#xe749;
- 
  template-default
  &#xe74a;
- 
  30－1
  &#xe67c;
- 
  免
  &#xe67e;
- 
  礼物
  &#xe685;
- 
  语音
  &#xe687;
- 
  libra
  &#xe74c;
- 
  survey
  &#xe74e;
- 
  ship
  &#xe74f;
- 
  bussiness-card
  &#xe753;
- 
  hot
  &#xe756;
- 
  data
  &#xe757;
- 
  trade
  &#xe758;
- 
  onepage
  &#xe75a;
- 
  locked-1
  &#xe63c;
- 
  locked
  &#xe63e;
- 
  signboard
  &#xe75c;
- 
  shuffling-banner
  &#xe75e;
- 
  component
  &#xe75f;
- 
  component-filling
  &#xe760;
- 
  color
  &#xe761;
- 
  color-filling
  &#xe7cd;
- 
  favorites
  &#xe7ce;
- 
  RFQ
  &#xe803;
- 
  original-image
  &#xe806;
- 
  logistic
  &#xe811;
- 
  Calculator
  &#xe812;
- 
  video
  &#xe820;
- 
  earth
  &#xe828;
- 
  task-management
  &#xe829;
- 
  trust
  &#xe82a;
- 
  password
  &#xe82b;
- 
  3column
  &#xe839;
- 
  apparel
  &#xe83a;
- 
  bags
  &#xe83b;
- 
  folder
  &#xe83c;
- 
  4column
  &#xe83d;
- 
  code
  &#xe842;
- 
  customs-clearance
  &#xe863;
- 
  good-filling
  &#xe866;
- 
  camera
  &#xe86e;
- 
  分享方式
  &#xeb61;
- 
  技术服务
  &#xebce;
- 
  运营管理
  &#xebd1;
- 
  pin-fill
  &#xe87a;
- 
  help-fill
  &#xe87b;
- 
  add-account
  &#xe87c;
- 
  软件开发包
  &#xec2e;
- 
  告警
  &#xec34;
- 
  任务进程
  &#xec35;
- 
  消息通知
  &#xec36;
- 
  listing-content
  &#xe87d;
- 
  warehouse-delivery
  &#xe87e;
- 
  customization
  &#xe87f;
- 
  inspection
  &#xe880;
- 
  packing-labeling
  &#xe881;
- 
  online-tracking
  &#xe882;
- 
  消息
  &#xec3b;
- 
  electrical-equipment
  &#xe886;
- 
  home-appliances
  &#xe887;
- 
  furniture
  &#xe888;
- 
  fashion-accessories
  &#xe889;
- 
  security-protection
  &#xe88a;
- 
  textile-products
  &#xe88b;
- 
  tools-hardware
  &#xe88c;
- 
  office-supplies
  &#xe88d;
- 
  vehicles
  &#xe88e;

## Unicode 引用

Unicode 是字体在网页端最原始的应用方式，特点是：

- 兼容性最好，支持 IE6+，及所有现代浏览器。
- 支持按字体的方式去动态调整图标大小，颜色等等。
- 但是因为是字体，所以不支持多色。只能使用平台里单色的图标，就算项目里有多色图标也会自动去色。

> 注意：新版 iconfont 支持多色图标，这些多色图标在 Unicode 模式下将不能使用，如果有需求建议使用symbol 的引用方式

Unicode 使用步骤如下：

### 第一步：拷贝项目下面生成的 `@font-face`

    @font-face {
      font-family: 'iconfont';
      src: url('iconfont.eot');
      src: url('iconfont.eot?#iefix') format('embedded-opentype'),
          url('iconfont.woff2') format('woff2'),
          url('iconfont.woff') format('woff'),
          url('iconfont.ttf') format('truetype'),
          url('iconfont.svg#iconfont') format('svg');
    }

### 第二步：定义使用 iconfont 的样式

    .iconfont {
      font-family: "iconfont" !important;
      font-size: 16px;
      font-style: normal;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
    }

### 第三步：挑选相应图标并获取字体编码，应用于页面

    <span class="iconfont">&#x33;</span>

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

- all
  .el-icon-third-all
- back
  .el-icon-third-back
- cart
  .el-icon-third-cart
- Category
  .el-icon-third-category
- close
  .el-icon-third-close
- comments
  .el-icon-third-comments
- cry
  .el-icon-third-cry
- delete
  .el-icon-third-delete
- edit
  .el-icon-third-edit
- email
  .el-icon-third-email
- favorite
  .el-icon-third-favorite
- form
  .el-icon-third-form
- help
  .el-icon-third-help
- information
  .el-icon-third-information
- less
  .el-icon-third-less
- more_unfold
  .el-icon-third-moreunfold
- more
  .el-icon-third-more
- pic
  .el-icon-third-pic
- QRCode
  .el-icon-third-qrcode
- refresh
  .el-icon-third-refresh
- RFQ
  .el-icon-third-rfq
- search
  .el-icon-third-search
- selected
  .el-icon-third-selected
- set
  .el-icon-third-set
- Smile
  .el-icon-third-smile
- success
  .el-icon-third-success
- survey
  .el-icon-third-survey
- training
  .el-icon-third-training
- ViewGallery
  .el-icon-third-viewgallery
- Viewlist
  .el-icon-third-viewlist
- warning
  .el-icon-third-warning
- wrong
  .el-icon-third-wrong
- account
  .el-icon-third-account
- add
  .el-icon-third-add
- atm
  .el-icon-third-atm
- clock
  .el-icon-third-clock
- remind
  .el-icon-third-remind
- calendar
  .el-icon-third-calendar
- attachment
  .el-icon-third-attachment
- discount
  .el-icon-third-discount
- service
  .el-icon-third-service
- print
  .el-icon-third-print
- box
  .el-icon-third-box
- process
  .el-icon-third-process
- beauty
  .el-icon-third-beauty
- electrical
  .el-icon-third-electrical
- home
  .el-icon-third-home
- electronics
  .el-icon-third-electronics
- gifts
  .el-icon-third-gifts
- lights
  .el-icon-third-lights
- sports
  .el-icon-third-sports
- toys
  .el-icon-third-toys
- auto
  .el-icon-third-auto
- jewelry
  .el-icon-third-jewelry
- trade-assurance
  .el-icon-third-trade-assurance
- browse
  .el-icon-third-browse
- rfq-qm
  .el-icon-third-rfqqm
- rfq-quantity
  .el-icon-third-rfqquantity
- atm-away
  .el-icon-third-atmaway
- rfq
  .el-icon-third-rfq1
- scanning
  .el-icon-third-scanning
- compare
  .el-icon-third-compare
- filter
  .el-icon-third-filter
- pin
  .el-icon-third-pin
- history
  .el-icon-third-history
- product-features
  .el-icon-third-productfeatures
- supplier-features
  .el-icon-third-supplierfeatures
- similar-product
  .el-icon-third-similarproduct
- link
  .el-icon-third-link
- cut
  .el-icon-third-cut
- nav-list
  .el-icon-third-navlist
- image-text
  .el-icon-third-imagetext
- text
  .el-icon-third-text
- move
  .el-icon-third-move
- subtract
  .el-icon-third-subtract
- dollar
  .el-icon-third-dollar
- raw
  .el-icon-third-raw
- office
  .el-icon-third-office
- agriculture
  .el-icon-third-agriculture
- machinery
  .el-icon-third-machinery
- assessed-Badge
  .el-icon-third-assessedbadge
- personal-center
  .el-icon-third-gerenzhongxin
- integral
  .el-icon-third-jifen
- operation
  .el-icon-third-operation
- remind
  .el-icon-third-remind1
- download
  .el-icon-third-icondownload
- map
  .el-icon-third-map
- iconfont-5
  .el-icon-third-iconfont5
- bad
  .el-icon-third-bad
- good
  .el-icon-third-good
- skip
  .el-icon-third-skip
- play
  .el-icon-third-iconfontplay2
- stop
  .el-icon-third-iconfontstop
- compass
  .el-icon-third-compass
- security
  .el-icon-third-security
- share
  .el-icon-third-share
- store
  .el-icon-third-store
- manage-order
  .el-icon-third-manageorder
- rejected-order
  .el-icon-third-rejectedorder
- phone
  .el-icon-third-phone
- bussiness-man
  .el-icon-third-bussinessman
- shoes
  .el-icon-third-shoes
- Mobile-phone
  .el-icon-third-mobilephone
- email-filling
  .el-icon-third-emailfilling
- favorites-filling
  .el-icon-third-favoritesfilling
- account-filling
  .el-icon-third-accountfilling
- wechat
  .el-icon-third-custom-wechat
- credit-level
  .el-icon-third-creditlevel
- credit-level-filling
  .el-icon-third-creditlevelfilling
- 客服
  .el-icon-third-kefu
- exl
  .el-icon-third-exl
- pdf
  .el-icon-third-pdf
- zip
  .el-icon-third-zip
- 购物车
  .el-icon-third-gouwuche
- 购物车添加
  .el-icon-third-gouwuchetianjia
- 错误
  .el-icon-third-cuowu
- 二维码
  .el-icon-third-erweima
- 聚收藏
  .el-icon-third-jushoucang
- 垃圾箱
  .el-icon-third-lajixiang
- sorting
  .el-icon-third-sorting
- 链接
  .el-icon-third-lianjie
- 闹钟
  .el-icon-third-naozhong
- 扫一扫
  .el-icon-third-saoyisao
- 上翻
  .el-icon-third-shangfan
- 设置
  .el-icon-third-shezhi
- 声音
  .el-icon-third-shengyin
- 时间
  .el-icon-third-shijian
- 收货地址
  .el-icon-third-shouhuodizhi
- 首页
  .el-icon-third-shouye
- 刷新
  .el-icon-third-shuaxin
- 搜索
  .el-icon-third-sousuo
- 锁
  .el-icon-third-suo
- 提示
  .el-icon-third-tishi
- 完成
  .el-icon-third-wancheng
- 我的订单
  .el-icon-third-wodedingdan
- 我的反馈
  .el-icon-third-wodefankui
- 我的红包
  .el-icon-third-wodehongbao
- 我的聚划算
  .el-icon-third-wodejuhuasuan
- 我的优惠券
  .el-icon-third-wodeyouhuiquan
- 下翻
  .el-icon-third-xiafan
- 下拉
  .el-icon-third-xiala
- 向上箭头
  .el-icon-third-xiangshangjiantou
- 向下箭头
  .el-icon-third-xiangxiajiantou
- 向右箭头
  .el-icon-third-xiangyoujiantou
- 向左箭头
  .el-icon-third-xiangzuojiantou
- 眼睛
  .el-icon-third-yanjing
- 意见反馈
  .el-icon-third-yijianfankui
- 照相机
  .el-icon-third-zhaoxiangji
- 正确
  .el-icon-third-zhengque
- 消息中心
  .el-icon-third-xiaoxizhongxin
- 另存为
  .el-icon-third-lingcunwei
- 火
  .el-icon-third-huo
- copy
  .el-icon-third-copy
- save
  .el-icon-third-save
- inquiry-template
  .el-icon-third-inquirytemplate
- template-default
  .el-icon-third-templatedefault
- 30－1
  .el-icon-third-301
- 免
  .el-icon-third-mian
- 礼物
  .el-icon-third-liwu
- 语音
  .el-icon-third-yuyin
- libra
  .el-icon-third-libra
- survey
  .el-icon-third-survey1
- ship
  .el-icon-third-ship
- bussiness-card
  .el-icon-third-bussinesscard
- hot
  .el-icon-third-hot
- data
  .el-icon-third-data
- trade
  .el-icon-third-trade
- onepage
  .el-icon-third-onepage48
- locked-1
  .el-icon-third-locked-1
- locked
  .el-icon-third-locked
- signboard
  .el-icon-third-signboard
- shuffling-banner
  .el-icon-third-shuffling-banner
- component
  .el-icon-third-component
- component-filling
  .el-icon-third-component-filling
- color
  .el-icon-third-color
- color-filling
  .el-icon-third-color-filling
- favorites
  .el-icon-third-favorites
- RFQ
  .el-icon-third-RFQ
- original-image
  .el-icon-third-originalimage
- logistic
  .el-icon-third-logistic
- Calculator
  .el-icon-third-Calculator
- video
  .el-icon-third-video
- earth
  .el-icon-third-earth
- task-management
  .el-icon-third-task-management
- trust
  .el-icon-third-trust
- password
  .el-icon-third-password
- 3column
  .el-icon-third-column
- apparel
  .el-icon-third-apparel
- bags
  .el-icon-third-bags
- folder
  .el-icon-third-folder
- 4column
  .el-icon-third-column1
- code
  .el-icon-third-code
- customs-clearance
  .el-icon-third-customs-clearance
- good-filling
  .el-icon-third-good-filling
- camera
  .el-icon-third-camera
- 分享方式
  .el-icon-third-fenxiangfangshi
- 技术服务
  .el-icon-third-jishufuwu
- 运营管理
  .el-icon-third-yunyingguanli
- pin-fill
  .el-icon-third-pin-fill
- help-fill
  .el-icon-third-help-fill
- add-account
  .el-icon-third-add-account
- 软件开发包
  .el-icon-third-ruanjiankaifabao
- 告警
  .el-icon-third-gaojing
- 任务进程
  .el-icon-third-renwujincheng
- 消息通知
  .el-icon-third-xiaoxitongzhi
- listing-content
  .el-icon-third-listing-content
- warehouse-delivery
  .el-icon-third-warehouse-delivery
- customization
  .el-icon-third-customization
- inspection
  .el-icon-third-inspection
- packing-labeling
  .el-icon-third-packing-labeling
- online-tracking
  .el-icon-third-online-tracking
- 消息
  .el-icon-third-xiaoxi
- electrical-equipment
  .el-icon-third-electrical-equipment
- home-appliances
  .el-icon-third-home-appliances
- furniture
  .el-icon-third-furniture
- fashion-accessories
  .el-icon-third-fashion-accessories
- security-protection
  .el-icon-third-security-protection
- textile-products
  .el-icon-third-textile-products
- tools-hardware
  .el-icon-third-tools-hardware
- office-supplies
  .el-icon-third-office-supplies
- vehicles
  .el-icon-third-vehicles

## font-class 引用

font-class 是 Unicode 使用方式的一种变种，主要是解决 Unicode 书写不直观，语意不明确的问题。

与 Unicode 使用方式相比，具有如下特点：

- 兼容性良好，支持 IE8+，及所有现代浏览器。
- 相比于 Unicode 语意明确，书写更直观。可以很容易分辨这个 icon 是什么。
- 因为使用 class 来定义图标，所以当要替换图标时，只需要修改 class 里面的 Unicode 引用。
- 不过因为本质上还是使用的字体，所以多色图标还是不支持的。

使用步骤如下：

### 第一步：引入项目下面生成的 fontclass 代码：

    <link rel="stylesheet" href="./iconfont.css">

### 第二步：挑选相应图标并获取类名，应用于页面：

    <span class="iconfont el-icon-third-xxx"></span>

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

- all
  #el-icon-third-all
- back
  #el-icon-third-back
- cart
  #el-icon-third-cart
- Category
  #el-icon-third-category
- close
  #el-icon-third-close
- comments
  #el-icon-third-comments
- cry
  #el-icon-third-cry
- delete
  #el-icon-third-delete
- edit
  #el-icon-third-edit
- email
  #el-icon-third-email
- favorite
  #el-icon-third-favorite
- form
  #el-icon-third-form
- help
  #el-icon-third-help
- information
  #el-icon-third-information
- less
  #el-icon-third-less
- more_unfold
  #el-icon-third-moreunfold
- more
  #el-icon-third-more
- pic
  #el-icon-third-pic
- QRCode
  #el-icon-third-qrcode
- refresh
  #el-icon-third-refresh
- RFQ
  #el-icon-third-rfq
- search
  #el-icon-third-search
- selected
  #el-icon-third-selected
- set
  #el-icon-third-set
- Smile
  #el-icon-third-smile
- success
  #el-icon-third-success
- survey
  #el-icon-third-survey
- training
  #el-icon-third-training
- ViewGallery
  #el-icon-third-viewgallery
- Viewlist
  #el-icon-third-viewlist
- warning
  #el-icon-third-warning
- wrong
  #el-icon-third-wrong
- account
  #el-icon-third-account
- add
  #el-icon-third-add
- atm
  #el-icon-third-atm
- clock
  #el-icon-third-clock
- remind
  #el-icon-third-remind
- calendar
  #el-icon-third-calendar
- attachment
  #el-icon-third-attachment
- discount
  #el-icon-third-discount
- service
  #el-icon-third-service
- print
  #el-icon-third-print
- box
  #el-icon-third-box
- process
  #el-icon-third-process
- beauty
  #el-icon-third-beauty
- electrical
  #el-icon-third-electrical
- home
  #el-icon-third-home
- electronics
  #el-icon-third-electronics
- gifts
  #el-icon-third-gifts
- lights
  #el-icon-third-lights
- sports
  #el-icon-third-sports
- toys
  #el-icon-third-toys
- auto
  #el-icon-third-auto
- jewelry
  #el-icon-third-jewelry
- trade-assurance
  #el-icon-third-trade-assurance
- browse
  #el-icon-third-browse
- rfq-qm
  #el-icon-third-rfqqm
- rfq-quantity
  #el-icon-third-rfqquantity
- atm-away
  #el-icon-third-atmaway
- rfq
  #el-icon-third-rfq1
- scanning
  #el-icon-third-scanning
- compare
  #el-icon-third-compare
- filter
  #el-icon-third-filter
- pin
  #el-icon-third-pin
- history
  #el-icon-third-history
- product-features
  #el-icon-third-productfeatures
- supplier-features
  #el-icon-third-supplierfeatures
- similar-product
  #el-icon-third-similarproduct
- link
  #el-icon-third-link
- cut
  #el-icon-third-cut
- nav-list
  #el-icon-third-navlist
- image-text
  #el-icon-third-imagetext
- text
  #el-icon-third-text
- move
  #el-icon-third-move
- subtract
  #el-icon-third-subtract
- dollar
  #el-icon-third-dollar
- raw
  #el-icon-third-raw
- office
  #el-icon-third-office
- agriculture
  #el-icon-third-agriculture
- machinery
  #el-icon-third-machinery
- assessed-Badge
  #el-icon-third-assessedbadge
- personal-center
  #el-icon-third-gerenzhongxin
- integral
  #el-icon-third-jifen
- operation
  #el-icon-third-operation
- remind
  #el-icon-third-remind1
- download
  #el-icon-third-icondownload
- map
  #el-icon-third-map
- iconfont-5
  #el-icon-third-iconfont5
- bad
  #el-icon-third-bad
- good
  #el-icon-third-good
- skip
  #el-icon-third-skip
- play
  #el-icon-third-iconfontplay2
- stop
  #el-icon-third-iconfontstop
- compass
  #el-icon-third-compass
- security
  #el-icon-third-security
- share
  #el-icon-third-share
- store
  #el-icon-third-store
- manage-order
  #el-icon-third-manageorder
- rejected-order
  #el-icon-third-rejectedorder
- phone
  #el-icon-third-phone
- bussiness-man
  #el-icon-third-bussinessman
- shoes
  #el-icon-third-shoes
- Mobile-phone
  #el-icon-third-mobilephone
- email-filling
  #el-icon-third-emailfilling
- favorites-filling
  #el-icon-third-favoritesfilling
- account-filling
  #el-icon-third-accountfilling
- wechat
  #el-icon-third-custom-wechat
- credit-level
  #el-icon-third-creditlevel
- credit-level-filling
  #el-icon-third-creditlevelfilling
- 客服
  #el-icon-third-kefu
- exl
  #el-icon-third-exl
- pdf
  #el-icon-third-pdf
- zip
  #el-icon-third-zip
- 购物车
  #el-icon-third-gouwuche
- 购物车添加
  #el-icon-third-gouwuchetianjia
- 错误
  #el-icon-third-cuowu
- 二维码
  #el-icon-third-erweima
- 聚收藏
  #el-icon-third-jushoucang
- 垃圾箱
  #el-icon-third-lajixiang
- sorting
  #el-icon-third-sorting
- 链接
  #el-icon-third-lianjie
- 闹钟
  #el-icon-third-naozhong
- 扫一扫
  #el-icon-third-saoyisao
- 上翻
  #el-icon-third-shangfan
- 设置
  #el-icon-third-shezhi
- 声音
  #el-icon-third-shengyin
- 时间
  #el-icon-third-shijian
- 收货地址
  #el-icon-third-shouhuodizhi
- 首页
  #el-icon-third-shouye
- 刷新
  #el-icon-third-shuaxin
- 搜索
  #el-icon-third-sousuo
- 锁
  #el-icon-third-suo
- 提示
  #el-icon-third-tishi
- 完成
  #el-icon-third-wancheng
- 我的订单
  #el-icon-third-wodedingdan
- 我的反馈
  #el-icon-third-wodefankui
- 我的红包
  #el-icon-third-wodehongbao
- 我的聚划算
  #el-icon-third-wodejuhuasuan
- 我的优惠券
  #el-icon-third-wodeyouhuiquan
- 下翻
  #el-icon-third-xiafan
- 下拉
  #el-icon-third-xiala
- 向上箭头
  #el-icon-third-xiangshangjiantou
- 向下箭头
  #el-icon-third-xiangxiajiantou
- 向右箭头
  #el-icon-third-xiangyoujiantou
- 向左箭头
  #el-icon-third-xiangzuojiantou
- 眼睛
  #el-icon-third-yanjing
- 意见反馈
  #el-icon-third-yijianfankui
- 照相机
  #el-icon-third-zhaoxiangji
- 正确
  #el-icon-third-zhengque
- 消息中心
  #el-icon-third-xiaoxizhongxin
- 另存为
  #el-icon-third-lingcunwei
- 火
  #el-icon-third-huo
- copy
  #el-icon-third-copy
- save
  #el-icon-third-save
- inquiry-template
  #el-icon-third-inquirytemplate
- template-default
  #el-icon-third-templatedefault
- 30－1
  #el-icon-third-301
- 免
  #el-icon-third-mian
- 礼物
  #el-icon-third-liwu
- 语音
  #el-icon-third-yuyin
- libra
  #el-icon-third-libra
- survey
  #el-icon-third-survey1
- ship
  #el-icon-third-ship
- bussiness-card
  #el-icon-third-bussinesscard
- hot
  #el-icon-third-hot
- data
  #el-icon-third-data
- trade
  #el-icon-third-trade
- onepage
  #el-icon-third-onepage48
- locked-1
  #el-icon-third-locked-1
- locked
  #el-icon-third-locked
- signboard
  #el-icon-third-signboard
- shuffling-banner
  #el-icon-third-shuffling-banner
- component
  #el-icon-third-component
- component-filling
  #el-icon-third-component-filling
- color
  #el-icon-third-color
- color-filling
  #el-icon-third-color-filling
- favorites
  #el-icon-third-favorites
- RFQ
  #el-icon-third-RFQ
- original-image
  #el-icon-third-originalimage
- logistic
  #el-icon-third-logistic
- Calculator
  #el-icon-third-Calculator
- video
  #el-icon-third-video
- earth
  #el-icon-third-earth
- task-management
  #el-icon-third-task-management
- trust
  #el-icon-third-trust
- password
  #el-icon-third-password
- 3column
  #el-icon-third-column
- apparel
  #el-icon-third-apparel
- bags
  #el-icon-third-bags
- folder
  #el-icon-third-folder
- 4column
  #el-icon-third-column1
- code
  #el-icon-third-code
- customs-clearance
  #el-icon-third-customs-clearance
- good-filling
  #el-icon-third-good-filling
- camera
  #el-icon-third-camera
- 分享方式
  #el-icon-third-fenxiangfangshi
- 技术服务
  #el-icon-third-jishufuwu
- 运营管理
  #el-icon-third-yunyingguanli
- pin-fill
  #el-icon-third-pin-fill
- help-fill
  #el-icon-third-help-fill
- add-account
  #el-icon-third-add-account
- 软件开发包
  #el-icon-third-ruanjiankaifabao
- 告警
  #el-icon-third-gaojing
- 任务进程
  #el-icon-third-renwujincheng
- 消息通知
  #el-icon-third-xiaoxitongzhi
- listing-content
  #el-icon-third-listing-content
- warehouse-delivery
  #el-icon-third-warehouse-delivery
- customization
  #el-icon-third-customization
- inspection
  #el-icon-third-inspection
- packing-labeling
  #el-icon-third-packing-labeling
- online-tracking
  #el-icon-third-online-tracking
- 消息
  #el-icon-third-xiaoxi
- electrical-equipment
  #el-icon-third-electrical-equipment
- home-appliances
  #el-icon-third-home-appliances
- furniture
  #el-icon-third-furniture
- fashion-accessories
  #el-icon-third-fashion-accessories
- security-protection
  #el-icon-third-security-protection
- textile-products
  #el-icon-third-textile-products
- tools-hardware
  #el-icon-third-tools-hardware
- office-supplies
  #el-icon-third-office-supplies
- vehicles
  #el-icon-third-vehicles

## Symbol 引用

这是一种全新的使用方式，应该说这才是未来的主流，也是平台目前推荐的用法。相关介绍可以参考这篇文章 这种用法其实是做了一个 SVG 的集合，与另外两种相比具有如下特点：

- 支持多色图标了，不再受单色限制。
- 通过一些技巧，支持像字体那样，通过 `font-size`, `color` 来调整样式。
- 兼容性较差，支持 IE9+，及现代浏览器。
- 浏览器渲染 SVG 的性能一般，还不如 png。

使用步骤如下：

### 第一步：引入项目下面生成的 symbol 代码：

    <script src="./iconfont.js"></script>

### 第二步：加入通用 CSS 代码（引入一次就行）：

    <style>
    .icon {
      width: 1em;
      height: 1em;
      vertical-align: -0.15em;
      fill: currentColor;
      overflow: hidden;
    }
    </style>

### 第三步：挑选相应图标并获取类名，应用于页面：

    <svg class="icon" aria-hidden="true">
      <use xlink:href="#icon-xxx"></use>
    </svg>