IconFont 图标
-
stepforward.icon-stepforward
-
stepbackward.icon-stepbackward
-
forward.icon-forward
-
banckward.icon-banckward
-
caretright.icon-caretright
-
caretleft.icon-caretleft
-
caretdown.icon-caretdown
-
caretup.icon-caretup
-
right-circle.icon-rightcircle
-
left-circle.icon-leftcircle
-
up-circle.icon-upcircle
-
down-circle.icon-downcircle
-
right-circle-o.icon-rightcircleo
-
left-circle-o.icon-leftcircleo
-
up-circle-o.icon-upcircleo
-
down-circle-o.icon-downcircleo
-
verticleleft.icon-verticleleft
-
verticleright.icon-verticleright
-
rollback.icon-back
-
retweet.icon-retweet
-
shrink.icon-shrink
-
arrowsalt.icon-arrowsalt
-
doubleright.icon-doubleright
-
doubleleft.icon-doubleleft
-
arrowdown.icon-arrowdown
-
arrowup.icon-arrowup
-
arrowright.icon-arrowright
-
arrowleft.icon-arrowleft
-
down.icon-down
-
up.icon-up
-
right.icon-right
-
left.icon-left
-
minus-square-o.icon-minussquareo
-
minus-circle.icon-minuscircle
-
minus-circle-o.icon-minuscircleo
-
minus.icon-minus
-
plus-circle-o.icon-pluscircleo
-
plus-circle.icon-pluscircle
-
plus.icon-plus
-
info-cirlce.icon-infocirlce
-
info-cirlce-o.icon-infocirlceo
-
info.icon-info
-
exclamation.icon-exclamation
-
exclamation-circle.icon-exclamationcircle
-
exclamation-circle-o.icon-exclamationcircleo
-
close-circle.icon-closecircle
-
close-circle-o.icon-closecircleo
-
check-circle.icon-checkcircle
-
check-circle-o.icon-checkcircleo
-
check.icon-check
-
close.icon-close
-
customerservice.icon-customerservice
-
creditcard.icon-creditcard
-
code-square-o.icon-codesquareo
-
book.icon-book
-
barschart.icon-barschart
-
bars.icon-bars
-
question.icon-question
-
question-circle.icon-questioncircle
-
question-circle-o.icon-questioncircleo
-
pause.icon-pause
-
pause-circle.icon-pausecircle
-
pause-circle-o.icon-pausecircleo
-
clock-circle.icon-clockcircle
-
clock-circle-o.icon-clockcircleo
-
swap.icon-swap
-
swapleft.icon-swapleft
-
swapright.icon-swapright
-
plus-square-o.icon-plussquareo
-
frown.icon-frown
-
menufold.icon-menufold
-
mail.icon-mail
-
link.icon-link
-
areachart.icon-areachart
-
linechart.icon-linechart
-
home.icon-home
-
laptop.icon-laptop
-
star.icon-star
-
star-o.icon-staro
-
filter.icon-filter
-
meho.icon-meho
-
meh.icon-meh
-
shoppingcart.icon-shoppingcart
-
save.icon-save
-
user.icon-user
-
videocamera.icon-videocamera
-
totop.icon-totop
-
team.icon-team
-
sharealt.icon-sharealt
-
setting.icon-setting
-
picture.icon-picture
-
phone.icon-phone
-
paperclip.icon-paperclip
-
notification.icon-notification
-
menuunfold.icon-menuunfold
-
inbox.icon-inbox
-
lock.icon-lock
-
qrcode.icon-qrcode
-
tags.icon-tags
-
tagso.icon-tagso
-
cloud-o.icon-cloudo
-
cloud.icon-cloud
-
cloudupload.icon-cloudupload
-
clouddownload.icon-clouddownload
-
clouddownload-o.icon-clouddownloado
-
cloudupload-o.icon-clouduploado
-
enviroment.icon-enviroment
-
enviroment-o.icon-enviromento
-
eye.icon-eye
-
eye-o.icon-eyeo
-
camera.icon-camera
-
camera-o.icon-camerao
-
windows.icon-windows
-
export2.icon-export2
-
export.icon-export
-
circledown-o.icon-circledowno
-
circledown.icon-circledown
-
hdd.icon-hdd
-
ie.icon-ie
-
delete.icon-delete
-
enter.icon-enter
-
pushpin-o.icon-pushpino
-
pushpin.icon-pushpin
-
heart.icon-heart
-
heart-o.icon-hearto
-
smile.icon-smile-circle
-
smile-o.icon-smileo
-
frown-o.icon-frowno
-
calculator.icon-calculator
-
chrome.icon-chrome
-
github.icon-github
-
desktop.icon-iconfontdesktop
-
caret-circle-o-up.icon-caretcircleoup
-
upload.icon-upload
-
download.icon-download
-
piechart.icon-piechart
-
lock.icon-lock1
-
unlock.icon-unlock
-
windows-o.icon-windowso
-
dotchart.icon-dotchart
-
barchart.icon-barchart
-
code-square.icon-codesquare
-
plus-square.icon-plussquare
-
minus-square.icon-minussquare
-
close-square.icon-closesquare
-
close-square-o.icon-closesquareo
-
check-square.icon-checksquare
-
check-square-o.icon-checksquareo
-
fastbackward.icon-fastbackward
-
fastforward.icon-fastforward
-
up-square.icon-upsquare
-
down-square.icon-downsquare
-
left-square.icon-leftsquare
-
right-square.icon-rightsquare
-
right-square-o.icon-rightsquareo
-
left-square-o.icon-leftsquareo
-
down-square-o.icon-down-square-o
-
up-square-o.icon-up-square-o
-
play.icon-play
-
play-circle-o.icon-playcircleo
-
tag.icon-tag
-
tag-o.icon-tago
-
addfile.icon-addfile
-
folder.icon-folder1
-
file.icon-file1
-
switcher.icon-switcher
-
addfolder.icon-addfolder
-
folderopen.icon-folderopen
-
search.icon-search1
-
ellipsis.icon-ellipsis1
-
calendar.icon-calendar
-
filetext.icon-filetext1
-
copy.icon-copy1
-
jpgfile.icon-jpgfile1
-
pdffile.icon-pdffile1
-
exclefile.icon-exclefile1
-
pptfile.icon-pptfile1
-
unknowfile.icon-unknowfile1
-
wordfile.icon-wordfile1
-
dingding.icon-dingding
-
dingding-o.icon-dingding-o
-
mobile.icon-mobile1
-
tablet.icon-tablet1
-
bells.icon-bells
-
disconnect.icon-disconnect
-
database.icon-database
-
barcode.icon-barcode
-
hourglass.icon-hourglass
-
key.icon-key
-
flag.icon-flag
-
layout.icon-layout
-
printer.icon-printer
-
USB.icon-USB
-
skin.icon-skin
-
tool.icon-tool
-
car.icon-car
-
addusergroup.icon-addusergroup
-
carryout.icon-carryout
-
deleteuser.icon-deleteuser
-
deleteusergroup.icon-deleteusergroup
-
man.icon-man
-
isv.icon-isv
-
gift.icon-gift
-
idcard.icon-idcard
-
medicinebox.icon-medicinebox
-
redenvelopes.icon-redenvelopes
-
rest.icon-rest
-
Safety.icon-Safety
-
wallet.icon-wallet
-
woman.icon-woman
-
adduser.icon-adduser
-
bank.icon-bank
-
Trophy.icon-Trophy
-
loading.icon-loading1
-
loading.icon-loading2
-
like.icon-like2
-
dislike.icon-dislike2
-
like.icon-like1
-
dislike.icon-dislike1
-
bulb.icon-bulb1
-
rocket.icon-rocket1
-
select.icon-select1
-
apple.icon-apple1
-
apple-o.icon-apple-o
-
android.icon-android1
-
android-o.icon-android
-
aliwangwang-o.icon-aliwangwang-o1
-
aliwangwang.icon-aliwangwang
-
pay-circle.icon-pay-circle1
-
pay-circle-o.icon-pay-circle-o1
-
poweroff.icon-poweroff
-
trademark.icon-trademark
-
find.icon-find
-
copyright.icon-copyright
-
sound.icon-sound
-
earth.icon-earth
-
wifi.icon-wifi
-
sync.icon-sync
-
login.icon-login
-
logout.icon-logout
-
reload.icon-reload1
-
message.icon-message1
-
shake.icon-shake
-
API.icon-API
-
appstore-o.icon-appstore-o
-
appstore.icon-appstore1
-
scan.icon-scan1
-
exception.icon-exception1
-
contacts.icon-contacts
-
solution.icon-solution1
-
fork.icon-fork
-
edit.icon-edit
-
表单.icon-form
-
error.icon-warning
-
列表.icon-table
-
详情.icon-profile
-
dashboard.icon-dashboard
-
indent-left.icon-indent-left
-
indent-right.icon-indent-right
-
menu-unfold.icon-menu-unfold
-
menu-fold.icon-menu-fold
-
ant design.icon-antdesign
-
alipay-square.icon-alipay-square
-
codepen-circle.icon-codepen-circle
-
google.icon-google
-
amazon.icon-amazon
-
codepen.icon-codepen
-
facebook-square.icon-facebook-square
-
dropbox.icon-dropbox
-
google plus.icon-googleplus
-
linkedin-square.icon-linkedin-square
-
medium-monogram.icon-medium-monogram
-
gitlab.icon-gitlab
-
medium-wordmark.icon-medium-wordmark
-
QQ.icon-QQ
-
skype.icon-skype
-
taobao-square.icon-taobao-square
-
alipay-circle.icon-alipay-circle
-
youtube.icon-youtube
-
wechat.icon-wechat
-
twitter.icon-twitter
-
weibo.icon-weibo
-
HTML5.icon-HTML
-
taobao-circle.icon-taobao-circle
-
weibo-circle.icon-weibo-circle
-
weibo-square.icon-weibo-square
-
CodeSandbox.icon-CodeSandbox
-
阿里云.icon-aliyun
-
zhihu.icon-zhihu
-
behance.icon-behance
-
dribbble.icon-dribbble
-
dribbble-square.icon-dribbble-square
-
behance-square.icon-behance-square
-
file-markdown.icon-file-markdown
-
instagram.icon-instagram
-
yuque.icon-yuque
-
slack.icon-slack
-
slack-square.icon-slack-square
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="anticon icon-xxx"></i>
"anticon"是你项目下的font-family。可以通过编辑项目查看,默认是"iconfont"。