Tree: f9157ab8c4

15 KiB

Raw Blame History

Iconfont

category: Components
chinese: 字体图标
order: 0
nodemos: true

有含义的矢量图形，每一个图标打倒一个敌人。

图标的命名规范

我们为每个图标赋予了语义化的命名。我们的命名规范如：

使用 - 来连接单词；
实心和描线图标保持同名，用 -o 来区分，比如 question-circle(实心) 和 question-circle-o(描线)；
命名顺序：[icon名]-[描线与否]-[方向]。

每个图标的类名需要在图标名称前加上 anticon- 前缀，如 .anticon-question-circle。

如何使用

使用时所有的图标都需要一个基类 .anticon 和对应每个图标的类。在这里，我们使用 <i> 标签，如下面代码演示使用即可。

<i class="anticon anticon-link"></i>

点击图标复制代码。

图标列表

一. 方向性图标

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

三. 网站通用图标