IconFont 图标
-
支付宝#icon-zhifubao
-
我#icon-wo
-
列表#icon-liebiao
-
添加#icon-tianjia
-
列表#icon-iconfontcolor69
-
安全#icon-anquan1
-
系统设置#icon-msnui-sys-set
-
more#icon-gengduo
-
输入2#icon-shuru2
-
个人中心-我的钱包#icon-gerenzhongxinwodeqianbao
-
miaojie_seller_selected#icon-miaojiesellerselected
-
Cloud network_2#icon-cloudnetwork2
-
safe#icon-safe
-
列表#icon-liebiao2
-
产品管理#icon-chanpinguanli
-
bind#icon-bind
-
用户#icon-yonghu
-
快捷应用#icon-kuaijieyingyon
-
more#icon-more
-
修改#icon-xiugai-copy
-
服务#icon-msnui-service
-
购物车添加#icon-gouwuchetianjia
-
二维码#icon-erweima
-
我的订单#icon-wodedingdan
-
我的红包#icon-wodehongbao
-
聚#icon-ju
-
充值记录#icon-chongzhijilu
-
服务#icon-fuwu
-
tel#icon-tel
-
圆点中#icon-yuandianzhong
-
云主机,云服务器架构#icon-yunzhuji
-
1u#icon-1u
-
2u#icon-2u
-
4u#icon-4u
-
模块#icon-ai-module
-
银联#icon-yinlian
-
充值2#icon-chongzhi2
-
列表#icon-liebiao1
-
文章管理02#icon-wenzhangguanli
-
我的钱包#icon-wodeqianbaoshangjia
-
免#icon-mian
-
pay-circle#icon-paycircle
-
勾#icon-gou
-
钱#icon-qian
-
控制中心#icon-control
-
成功#icon-chenggong
-
success#icon-success
-
财务管理#icon-caiwuguanli
-
扫码#icon-saoma
-
云开发主机#icon-yunkaifazhuji
-
yxx_wechat_pay_success#icon-weixinzhifu1
-
成功#icon-Success-Small
-
aright#icon-aright
-
安全#icon-anquan2
-
用户#icon-yonghu4
-
删除#icon-shanchu
-
buy-webhosting-step1-dns#icon-buywebhostingstep1dns
-
buy-webhosting-step1-domain#icon-buywebhostingstep1domain
-
buy-webhosting-step2-server-security#icon-buywebhostingstep2serversecurity
-
警告#icon-jinggao
-
用户#icon-yonghu1
-
时间#icon-time
-
首页#icon-shouye
-
加入云主机#icon-jiaruyunzhuji
-
云主机(pitch on)#icon-yunzhujipitchon
-
云主机#icon-yunzhuji1
-
设置#icon-shezhi
-
home#icon-home
-
Preview#icon-Preview
-
财务数据#icon-caiwushuju
-
clock#icon-naozhong
-
设置#icon-shezhi-xue
-
back#icon-back1
-
微信支付#icon-weixinzhifu
-
工单#icon-order
-
paysuccess#icon-paysuccess
-
设置#icon-shezhi1
-
充值记录#icon-chongzhijilu1
-
easy#icon-easy
-
warn#icon-warn
-
pc#icon-pc
-
用户#icon-yonghu2
-
Speed#icon-Speed
-
高性价比#icon-gaoxingjiabi
-
我的工单#icon-myOrder
-
余额 (1)#icon-yue
-
host#icon-p_host
-
域名与网站#icon-yumingyuwangzhan
-
云虚拟主机#icon-yunxunizhuji
-
dns云解析#icon-dnsyunjiexi
-
云数据库 redis#icon-NoSQLshujukuredis
-
控制台#icon-kongzhitai-
-
用户#icon-yonghu3
-
安全#icon-anquan
-
售后#icon-shouhou
-
忘记密码#icon-wangjimima
-
账单#icon-zhangdan
-
输入#icon-shuru
-
域名解析#icon-yumingjiexi
-
返回#icon-fanhui
-
关闭#icon-guanbi
-
全屏#icon-quanping
-
箭头 上#icon-jiantoushang
-
箭头 上#icon-jiantoushang1
-
箭头 右#icon-jiantouyou
-
箭头 下#icon-jiantouxia
-
扫一扫#icon-saoyisao
-
分类#icon-fenlei
-
选中#icon-xuanzhong
-
设置#icon-shezhi2
-
闪电#icon-shandian
-
wechat#icon-wechat1
-
订单#icon-dingdan
-
关闭26#icon-guanbi1
-
快捷标签#icon-kuaijiebiaoqian
-
stable#icon-stable
-
hosting#icon-host
-
换一换#icon-huanyihuan
-
照相机#icon-zhaoxiangji
-
主机#icon-zhuji
-
number_6#icon-number_
-
number_7#icon-number_1
-
number_9#icon-number_2
-
number_0#icon-number_3
-
number_3#icon-number_4
-
number_1#icon-number_5
-
number_4#icon-number_6
-
number_8#icon-number_7
-
number_punctuation#icon-number_punctuation
-
账单#icon-zhangdan1
-
number_5#icon-number_8
-
number_2#icon-number_9
-
add#icon-add
-
3column#icon-column
-
back#icon-back
-
extend#icon-extend
-
forward#icon-forward
-
increase#icon-increase
-
left#icon-left
-
nav-list#icon-nav-list
-
navigation#icon-navigation
-
register#icon-register
-
refresh#icon-refresh
-
search#icon-search
-
setting#icon-setting
-
sync#icon-sync
-
view-list#icon-view-list
-
search-o#icon-search-o
-
view-list-o#icon-view-list-o
-
cloud-hosting#icon-cloud-hosting
-
arrow-down#icon-arrow-down
-
arrow-left#icon-arrow-left
-
arrow-right#icon-arrow-right
-
arrow-up#icon-arrow-up
-
arrow-down#icon-arrow-down1
-
arrow-right#icon-arrow-right1
-
arrow-left#icon-arrow-left1
-
arrow-up#icon-arrow-up1
-
cloud logo#icon-cloudlogo
-
twitter#icon-twitter
-
wechat#icon-wechat
-
weibo#icon-weibo
-
qzone#icon-qzone
-
qq#icon-qq
-
github#icon-github
-
csdn#icon-csdn
-
Facebook#icon-Facebook
-
alipay#icon-alipay
-
linkedin#icon-linkedin
-
google#icon-google
-
skype#icon-skype
-
union_pay#icon-union_pay
-
alipay#icon-alipay1
-
IDC管理#icon-IDCguanli
-
微信#icon-weixin
-
售后#icon-shouhou1
-
hostSafe#icon-fanghuyezhuji
-
箭头#icon-jiantou
-
主机#icon-zhuji1
-
绑定账号#icon-bangdingzhanghao
-
w0810005空调机房#icon-wkongtiaojifang
-
IDC机房#icon-IDCjifang
-
闪电#icon-shandian1
-
IDC机房#icon-IDCjifang1
-
绑定账号#icon-bangdingzhanghao-copy
symbol引用
这是一种全新的使用方式,应该说这才是未来的主流,也是平台目前推荐的用法。相关介绍可以参考这篇文章 这种用法其实是做了一个svg的集合,与另外两种相比具有如下特点:
- 支持多色图标了,不再受单色限制。
- 通过一些技巧,支持像字体那样,通过
font-size
,color
来调整样式。 - 兼容性较差,支持 ie9+,及现代浏览器。
- 浏览器渲染svg的性能一般,还不如png。
使用步骤如下:
第一步:引入项目下面生成的symbol代码:
<script src="./iconfont.js"></script>
第二步:加入通用css代码(引入一次就行):
<style type="text/css">
.icon {
width: 1em; height: 1em;
vertical-align: -0.15em;
fill: currentColor;
overflow: hidden;
}
</style>
第三步:挑选相应图标并获取类名,应用于页面:
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-xxx"></use>
</svg>