IconFont 图标
-
appreciate
-
check
-
close
-
edit
-
emoji
-
favor_fill
-
favor
-
loading
-
location_fill
-
location
-
phone
-
round_check_fill
-
round_check
-
round_close_fill
-
round_close
-
round_right_fill
-
round_right
-
search
-
taxi
-
time_fill
-
time
-
unfold
-
warn_fill
-
warn
-
camera_fill
-
camera
-
comment_fill
-
comment
-
like_fill
-
like
-
notification_fill
-
notification
-
order
-
same_fill
-
same
-
deliver
-
evaluate
-
pay
-
send
-
shop
-
ticket
-
wang
-
back
-
cascades
-
discover
-
list
-
more
-
my_fill
-
my
-
scan
-
settings
-
question_fill
-
question
-
shop_fill
-
form
-
wang_fill
-
pic
-
filter
-
footprint
-
top
-
pull_down
-
pull_up
-
right
-
refresh
-
more_android
-
delete_fill
-
refund
-
cart
-
qr_code
-
remind
-
delete
-
profile
-
home
-
cart_fill
-
discover_fill
-
home_fill
-
message
-
address_book
-
link
-
lock
-
unlock
-
vip
-
weibo
-
activity
-
big
-
friend_add_fill
-
friend_add
-
friend
-
goods
-
selection
-
tmall
-
explore
-
present
-
square_check_fill
-
square
-
square_check
-
round
-
round_add
-
add
-
notification_forbid_fill
-
explore_fill
-
fold
-
game
-
redpacket
-
selection_fill
-
similar
-
appreciate_fill
-
info_fill
-
info
-
tao
-
mobile_tao
-
forward_fill
-
forward
-
recharge_fill
-
recharge
-
vipcard
-
voice
-
voice_fill
-
friend_favor
-
wifi
-
share
-
we_fill
-
we
-
light_auto
-
light_forbid
-
light_fill
-
camera_rotate
-
light
-
bar_code
-
flashlight_close
-
flashlight_open
-
search_list
-
service
-
sort
-
1212
-
down
-
mobile
-
mobile_fill
-
copy
-
countdown_fill
-
countdown
-
notice_fill
-
notice
-
qiang
-
upstage_fill
-
upstage
-
baby_fill
-
baby
-
brand_fill
-
brand
-
choiceness_fill
-
choiceness
-
clothes_fill
-
clothes
-
creative_fill
-
creative
-
female
-
keyboard
-
male
-
new_fill
-
new
-
pull_left
-
pull_right
-
rank_fill
-
rank
-
bad
-
camera_add
-
focus
-
friend_fill
-
camera_add_fill
-
apps
-
paint_fill
-
paint
-
pic_fill
-
refresh_arrow
-
mark_fill
-
mark
-
present_fill
-
repeal
-
album
-
people_fill
-
people
-
service_fill
-
repair
-
file
-
repair_fill
-
taoxiaopu
-
attention_fill
-
attention
-
command_fill
-
command
-
community_fill
-
community
-
read
-
calendar
-
cut
-
magic
-
backward_fill
-
forward_fill
-
play_fill
-
stop
-
tag_fill
-
tag
-
group
-
all
-
back_delete
-
hot_fill
-
hot
-
post
-
radio_box
-
round_down
-
upload
-
write_fill
-
write
-
radio_box_fill
-
punch
-
shake
-
add
-
move
-
safe
-
activity_fill
-
crown_fill
-
crown
-
goods_fill
-
message_fill
-
profile_fill
-
sound
-
sponsor_fill
-
sponsor
-
up_block
-
we_block
-
we_unblock
-
my
-
my_fill
-
emoji_fill
-
emoji_flash_fill
-
flashbuy_fill
-
text
-
video_fill
-
video
-
goods_favor
-
music_fill
-
music_forbid_fill
-
xiami_forbid
-
xiami
-
round_left_fill
-
triangle_down_fill
-
triangle_up_fill
-
round_left_fill
-
pull_down
-
appreciate_light
-
emoji_light
-
goods_light
-
keyboard_light
-
record_fill
-
record_light
-
record
-
round_add_light
-
sound_light
-
cardboard_fill
-
cardboard
-
form_fill
-
coin
-
sort_light
-
cardboard_forbid
-
circle_fill
-
circle
-
attention_forbid
-
attention_forbid_fill
-
attention_favor_fill
-
attention_favor
-
profile_light
-
pic_light
-
shop_light
-
voice_light
-
attention_favor_fill
-
camera_light
-
full
-
mail
-
people_list
-
cmswing
-
cmswing-o
-
cmswing-o-w
-
cmswing-o-b
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.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;
-webkit-text-stroke-width: 0.2px;
-moz-osx-font-smoothing: grayscale;
}
第三步:挑选相应图标并获取字体编码,应用于页面
<i class="iconfont">3</i>
"iconfont"是你项目下的font-family。可以通过编辑项目查看,默认是"iconfont"。