IconFont 图标
-
内容展示.icon-neirongzhanshi
-
方形-.icon-layoutcolumn
-
image.icon-image
-
图文.icon-tuwen
-
地图.icon-ditu
-
表单容器.icon-form
-
分页符.icon-fenyefu
-
调整模板.icon-progress
-
layout-column4.icon-layoutcolumn4
-
晴.icon-qing
-
暴雨.icon-baoyu
-
打雷.icon-dalei
-
大暴雨.icon-dabaoyu
-
大风.icon-dafeng
-
大雪.icon-daxue
-
大雨.icon-dayu
-
多云.icon-duoyun
-
雾.icon-wu
-
小雪.icon-xiaoxue
-
小雨.icon-xiaoyu
-
阴.icon-yin
-
中雨.icon-zhongyu
-
语音输入.icon-yuyinshuru
-
Wifi.icon-wifi
-
browser.icon-browser
-
底部导航_更多.icon-menus
-
label.icon-label
-
文本.icon-txt
-
店铺.icon-dianpu
-
评论.icon-pinglun
-
回复的帖子.icon-huifudetiezi
-
更多.icon-more
-
我的分享.icon-wodefenxiang
-
我发的帖子.icon-wofadetiezi
-
我的收藏.icon-shoucang
-
社区.icon-shequ
-
已发货订单.icon-yifahuodingdan
-
已完成订单.icon-yiwanchengdingdan
-
tab.icon-tab
-
声音.icon-shengyin
-
单行输入框.icon-danxingshurukuang
-
badge.icon-i-badge
-
部门树.icon-bumenshu
-
1400-折叠控件.icon-accotd
-
1414-分页控件.icon-page
-
电话图标.icon-dianhuatubiao
-
css.icon-css
-
switch.icon-switch
-
下载文件夹.icon-xiazaiwenjianjia
-
导航.icon-navigator
-
下单优惠.icon-xiadanyouhui
-
充值返现.icon-chongzhifanxian
-
核查公告.icon-hechagonggao
-
增加员工.icon-zengjiayuangong
-
员工列表.icon-yuangongliebiao
-
alarm-clock.icon-alarmclock
-
alert.icon-alert
-
align-center.icon-aligncenter
-
align-justify.icon-alignjustify
-
align-left.icon-alignleft
-
align-right.icon-alignright
-
anchor.icon-anchor
-
angle-double-down.icon-angledoubledown
-
angle-double-left.icon-angledoubleleft
-
angle-double-right.icon-angledoubleright
-
angle-double-up.icon-angledoubleup
-
angle-down.icon-angledown
-
angle-left.icon-angleleft
-
angle-right.icon-angleright
-
angle-up.icon-angleup
-
window.icon-window
-
zip.icon-zip
-
zoom-in.icon-zoomin
-
zoom-out.icon-zoomout
-
underline.icon-underline
-
unlock.icon-unlock
-
uppercase.icon-uppercase
-
vector.icon-vector
-
view-grid.icon-viewgrid
-
view-list.icon-viewlist
-
view-list-alt.icon-viewlistalt
-
clip.icon-clip
-
clipboard.icon-clipboard
-
layout-tab-v.icon-layouttabv
-
layout-column2.icon-layoutcolumn2
-
layout-column3.icon-layoutcolumn3
-
layout_2.icon-layout2
-
快捷面板-01.icon-panel
-
js.icon-js
-
输入-键盘.icon-shurujianpan
-
Add.icon-add
-
iframe.icon-iframe2
-
HTML.icon-HTML
-
edit.icon-bianji
-
breadcrumb-toolbar.icon-breadcrumb
-
底部导航.icon-bottomtab
-
button.icon-button
-
bad.icon-bad
-
good.icon-good
-
数值输入.icon-plus-numberfill
-
填空题.icon-blanksfill
-
网格.icon-grid
-
暂停.icon-pause
-
活动.icon-activity
-
数据集.icon-shujuji
-
二维码扫描.icon-qrcode
-
iframe.icon-iframe
-
android.icon-android
-
appleo.icon-appleo
-
folder.icon-folder
-
folderopen.icon-folderopen
-
iconfontdesktop.icon-iconfontdesktop
-
ie.icon-ie
-
info.icon-info
-
laptop.icon-laptop
-
mail.icon-mail
-
mobile.icon-mobile
-
phone.icon-phone
-
poweroff.icon-poweroff
-
question.icon-question
-
reload.icon-reload
-
tablet.icon-tablet
-
windowso.icon-windowso
-
正确.icon-icon
-
版权.icon-banquan
-
常见问题.icon-changjianwenti
-
message.icon-message
-
电话.icon-dianhua
-
返回顶部.icon-retop
-
分享量.icon-fenxiangliang
-
首页.icon-shouye
-
推荐.icon-tuijian
-
微信.icon-weixin
-
树结构.icon-shujiegou
-
上传按钮.icon-shangchuananniu
-
QQ.icon-qq
-
logout.icon-logout
-
upload.icon-upload
-
图文.icon-tuwen1
-
delete.icon-delete1
-
password.icon-password
-
没有内容.icon-empty
-
电脑电器.icon-diannaodianqi
-
相机.icon-xiangji
-
位置.icon-weizhi
-
已解锁.icon-yijiesuo
-
已锁.icon-yisuo
-
放大.icon-fangda
-
缩小.icon-suoxiao
-
搜索.icon-sousuo
-
宫格容器.icon-flex
-
图表-表格.icon-table
-
人物-@.icon-renyuan
-
操作-评论.icon-comment
-
人物-名片.icon-card
-
符号-相机.icon-fuhao-xiangji
-
符号-日期区间.icon-riqiqujian
-
符号-日期-线性.icon-date
-
符号-音频.icon-audio
-
操作-退出.icon-tuichu
-
人物-账号管理.icon-peplesetting
-
实物-显示器.icon-desktop
-
操作-删除.icon-delete
-
指向-bottom.icon-bottom
-
指向-left.icon-left
-
指向-left_double.icon-lefts
-
指向-right_double.icon-rights
-
指向-top.icon-top
-
指向-right.icon-right
-
实物-摄像头.icon-camera
-
符号-视频.icon-video
-
操作-搜索.icon-search
-
图表-折线图.icon-line
-
符号-文档.icon-document
-
图表-仪表盘.icon-dashboard
-
图表-柱状图.icon-bar
-
符号-附件.icon-attachment
-
操作-排序-降序.icon-desc
-
人物-搜索.icon-searchpeple
-
操作-排序-升序.icon-asc
-
人物-人.icon-pepole
-
人物-增加.icon-addpepole
-
操作-上传-upload.icon-cloudupload
-
符号-日期-实色.icon-richeng
-
操作-设置.icon-setting
-
操作-收藏-line.icon-shoucang1
-
符号-首页.icon-home
-
实物-手机.icon-shebei-shouji
-
操作-打印.icon-print
-
实物-书.icon-book
-
人物-团队.icon-team
-
操作-刷新.icon-refresh
-
符号-位置.icon-location
-
操作-上传-download.icon-clounddown
-
符号-新闻-线性.icon-news
-
图表-流程.icon-department
-
图表-饼图.icon-pie
-
符号-下拉.icon-xiala
-
符号-标签.icon-biaoqian
-
符号-步骤条.icon-step
-
符号-菜单.icon-caidan
-
符号-穿梭框.icon-chuansuokuang
-
符号-单行输入框.icon-input
-
符号-多选.icon-checkbox
-
符号-迭代器.icon-diedaiqi
-
符号-单选.icon-radio
-
符号-多行输入框.icon-textarea
-
符号-分栏.icon-fenlan
-
符号-富文本.icon-fuwenben
-
符号-级联选择.icon-cascade
-
符号-警告提示.icon-jinggaotishi
-
符号-复选择器.icon-mulitselect
-
符号-链接块.icon-link
-
符号-列表容器.icon-liebiaorongqi
-
符号-轮播图.icon-slider
-
符号-容器.icon-view
-
符号-筛选.icon-filter
-
符号-时间轴.icon-timeline
-
符号-树选择器.icon-dropdowntree
-
符号-数据矩阵.icon-shujujuzhen
-
符号-数字输入框.icon-number
-
符号-图片上传.icon-imgupload
-
符号-图片.icon-img
-
符号-文本.icon-text
-
符号-下拉单选.icon-select
-
符号-Dialog.icon-dialog
-
符号-文字提示.icon-tip
-
符号-选项卡.icon-xuanxiangqia
-
符号-折叠面板.icon-accord
-
符号-html.icon-code
-
下载文件.icon-xiazaiwenjian
-
数据.icon-shuju
-
操作-评星-full.icon-xin
-
树.icon-tree
-
进度-line.icon-jindutiao
-
上传文件.icon-shangchuanwenjian1
-
音乐.icon-yinle
-
new-window-1.icon-new-window
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"。