# Iconfont - category: Components - chinese: 字体图标 - type: 基本 - noinstant: true --- 有含义的矢量图形,每一个图标打倒一个敌人。 ## 图标的命名规范 我们为每个图标赋予了语义化的命名。只需在 标签内,制定对应的 type 属性即可。 不同 type 命名规则如下: - 实心和描线图标保持同名,用 `-o` 来区分,比如 `question-circle`(实心) 和 `question-circle-o`(描线); - 命名顺序:`[icon名]-[描线与否]-[方向]`。 ## 实现原理 所有的 Icon 标签最终会渲染为 ```html ``` ## 如何使用 使用 标签申明组件,设置对应的 type 设置需要渲染的图标,示例代码如下: ```html ``` > 点击图标复制代码。 ## 图标列表 ### 一. 方向性图标
  • step-backward
  • step-forward
  • fast-backward
  • fast-forward
  • shrink
  • arrow-salt
  • down
  • up
  • left
  • right
  • caret-down
  • caret-up
  • caret-left
  • caret-right
  • caret-circle-right
  • caret-circle-left
  • caret-circle-o-right
  • caret-circle-o-left
  • circle-right
  • circle-left
  • circle-o-right
  • circle-o-left
  • double-right
  • double-left
  • verticle-right
  • verticle-left
  • forward
  • backward
  • rollback
  • retweet
### 二. 提示建议性图标
  • question
  • question-circle-o
  • question-circle
  • plus
  • plus-circle-o
  • plus-circle
  • pause
  • pause-circle-o
  • pause-circle
  • minus
  • minus-circle-o
  • minus-circle
  • info
  • info-circle-o
  • info-circle
  • exclamation
  • exclamation-circle-o
  • exclamation-circle
  • cross
  • cross-circle-o
  • cross-circle
  • check
  • check-circle-o
  • check-circle
  • clock-circle-o
  • clock-circle
### 三. 网站通用图标
  • lock
  • unlock
  • android
  • apple
  • area-chart
  • bar-chart
  • bars
  • book
  • calendar
  • cloud
  • cloud-download
  • code
  • copy
  • credit-card
  • delete
  • desktop
  • download-line
  • edit
  • ellipsis
  • environment
  • file
  • file-text
  • folder
  • folder-open
  • github
  • hdd
  • frown
  • meh
  • inbox
  • laptop
  • appstore
  • line-chart
  • link
  • logout
  • mail
  • menu-fold
  • menu-unfold
  • mobile
  • notification
  • paper-clip
  • picture
  • pie-chart
  • poweroff
  • reload
  • search
  • setting
  • share-alt
  • shopping-cart
  • smile
  • tablet
  • tag
  • tags
  • to-top
  • upload
  • user
  • video-camera
  • windows
  • ie
  • chrome
  • home
  • loading