IconFont 图标
-
会员.icon-wsmp-payuser
-
健康 水滴.icon-jiankangshuidi
-
报错.icon-iconbaocuo
-
225默认头像.icon-morentouxiang
-
accessory.icon-accessory
-
add.icon-add
-
addition_fill.icon-addition_fill
-
addition.icon-addition
-
addressbook_fill.icon-addressbook_fill
-
addressbook.icon-addressbook
-
browse_fill.icon-browse_fill
-
brush.icon-brush
-
brush_fill.icon-brush_fill
-
computer_fill.icon-computer_fill
-
computer.icon-computer
-
coordinates_fill.icon-coordinates_fill
-
coordinates.icon-coordinates
-
coupons_fill.icon-coupons_fill
-
customerservice_fill.icon-customerservice_fill
-
customerservice.icon-customerservice
-
document.icon-document
-
document_fill.icon-document_fill
-
dynamic_fill.icon-dynamic_fill
-
editor.icon-editor
-
emoji.icon-emoji
-
enter.icon-enter
-
flag_fill.icon-flag_fill
-
flag.icon-flag
-
group_fill.icon-group_fill
-
headlines_fill.icon-headlines_fill
-
homepage_fill.icon-homepage_fill
-
homepage.icon-homepage
-
interactive_fill.icon-interactive_fill
-
interactive.icon-interactive
-
label.icon-label
-
like_fill.icon-like_fill
-
like.icon-like
-
lock.icon-lock
-
mail.icon-mail
-
manage.icon-manage
-
message.icon-message
-
mine_fill.icon-mine_fill
-
mobilephone_fill.icon-mobilephone_fill
-
mobilephone.icon-mobilephone
-
offline_fill.icon-offline_fill
-
offline.icon-offline
-
order_fill.icon-order_fill
-
other.icon-other
-
picture_fill.icon-picture_fill
-
prompt_fill.icon-prompt_fill
-
qrcode_fill.icon-qrcode_fill
-
remind_fill.icon-remind_fill
-
remind.icon-remind
-
return.icon-return
-
service_fill.icon-service_fill
-
service.icon-service
-
setup_fill.icon-setup_fill
-
setup.icon-setup
-
smallscreen.icon-smallscreen
-
success_fill.icon-success_fill
-
success.icon-success
-
time_fill.icon-time_fill
-
trash.icon-trash
-
trash_fill.icon-trash_fill
-
undo.icon-undo
-
workbench_fill.icon-workbench_fill
-
导入.icon-daoru
-
search.icon-search
-
packup.icon-packup
-
unfold.icon-unfold
-
wangwang_fill.icon-wangwang
-
验证码.icon-yanzhengma
-
报错-插画.icon-baocuo-chahua
-
朋友.icon-pengyou
-
所有.icon-suoyou
-
会员.icon-huiyuan
-
会员.icon-huiyuan1
-
空页面.icon-kongyemian
-
logout.icon-logout
-
cloud upload-o.icon-cloudupload-o
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"。