IconFont 图标
-
人民币.icon-renminbi
-
书.icon-shu
-
停止.icon-iconfonttingzhi
-
文件夹 闭合icon.icon-wenjianjiabiheicon
-
姓名 用户名 昵称.icon-xingmingyonghumingnicheng
-
网站 网址.icon-wangzhanwangzhi
-
消息.icon-xiaoxi
-
修改.icon-weibiaoti101
-
评论.icon-pinglun-copy
-
注册.icon-zhuce
-
留言.icon-liuyan
-
验证码 (3).icon-yanzhengma3
-
图片.icon-unie62e
-
下载.icon-download
-
站点.icon-zhandian
-
招聘会-选中.icon-zhaopinhuixuanzhong
-
流量.icon-liuliang
-
添加.icon-tianjia
-
操作-辅助功能.icon-caozuo-fuzhugongneng
-
客户拜访.icon-kehubaifang
-
更多.icon-gengduo
-
appstoreo.icon-appstoreo
-
barschart.icon-barschart
-
file.icon-file
-
home.icon-home
-
iconfontdesktop.icon-iconfontdesktop
-
setting.icon-setting
-
user.icon-user
-
windowso.icon-windowso
-
来源.icon-laiyuan
-
文件夹.icon-icon_folder
-
手机.icon-shouji
-
暂停.icon-icon-test
-
删除.icon-shanchu1
-
箭头 上.icon-jiantoushang
-
禁止.icon-jinzhi
-
回到顶部.icon-huidaodingbu
-
视频.icon-shipin1
-
隐藏密码.icon-yincangmima-
-
新闻目录.icon-shijian
-
运营.icon-yunying
-
图片.icon-tupian
-
目录.icon-mulu
-
退出.icon-out-copy
-
我的资料.icon-bianji-copy
-
网站.icon-wangzhan-copy
-
返回.icon-fanhui
-
下箭头.icon-arrow-down
-
内容.icon-neirong
-
查看.icon-chakan
-
放大.icon-fangda
-
右移-选中.icon-youyi-xuanzhong
-
17@APP首页图标-订单.icon-APPshouyetubiao-dingdan
-
暂停 copy 16.icon-zantingcopy
-
平台.icon-pingtai
-
箭头 上.icon-jiantouxia
-
图片.icon-image
-
控制台-注释.icon-kongzhitai-zhushi
-
解除断网.icon-jiechuduanwang
-
向上.icon-icon--
-
向下.icon-icon--1
-
添加.icon-icon--2
-
减去.icon-icon--3
-
回到顶部.icon-huidaodingbu-copy
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"。