IconFont 图标
-
内容展示
-
方形-
-
image
-
图文
-
地图
-
表单容器
-
分页符
-
调整模板
-
layout-column4
-
晴
-
暴雨
-
打雷
-
大暴雨
-
大风
-
大雪
-
大雨
-
多云
-
雾
-
小雪
-
小雨
-
阴
-
中雨
-
语音输入
-
Wifi
-
browser
-
底部导航_更多
-
label
-
文本
-
店铺
-
评论
-
回复的帖子
-
更多
-
我的分享
-
我发的帖子
-
我的收藏
-
社区
-
已发货订单
-
已完成订单
-
tab
-
声音
-
单行输入框
-
badge
-
部门树
-
1400-折叠控件
-
1414-分页控件
-
电话图标
-
css
-
switch
-
下载文件夹
-
导航
-
下单优惠
-
充值返现
-
核查公告
-
增加员工
-
员工列表
-
alarm-clock
-
alert
-
align-center
-
align-justify
-
align-left
-
align-right
-
anchor
-
angle-double-down
-
angle-double-left
-
angle-double-right
-
angle-double-up
-
angle-down
-
angle-left
-
angle-right
-
angle-up
-
window
-
zip
-
zoom-in
-
zoom-out
-
underline
-
unlock
-
uppercase
-
vector
-
view-grid
-
view-list
-
view-list-alt
-
clip
-
clipboard
-
layout-tab-v
-
layout-column2
-
layout-column3
-
layout_2
-
快捷面板-01
-
js
-
输入-键盘
-
Add
-
iframe
-
HTML
-
edit
-
breadcrumb-toolbar
-
底部导航
-
button
-
bad
-
good
-
数值输入
-
填空题
-
网格
-
暂停
-
活动
-
数据集
-
二维码扫描
-
iframe
-
android
-
appleo
-
folder
-
folderopen
-
iconfontdesktop
-
ie
-
info
-
laptop
-
mail
-
mobile
-
phone
-
poweroff
-
question
-
reload
-
tablet
-
windowso
-
正确
-
版权
-
常见问题
-
message
-
电话
-
返回顶部
-
分享量
-
首页
-
推荐
-
微信
-
树结构
-
上传按钮
-
QQ
-
logout
-
upload
-
图文
-
delete
-
password
-
没有内容
-
电脑电器
-
相机
-
位置
-
已解锁
-
已锁
-
放大
-
缩小
-
搜索
-
宫格容器
-
图表-表格
-
人物-@
-
操作-评论
-
人物-名片
-
符号-相机
-
符号-日期区间
-
符号-日期-线性
-
符号-音频
-
操作-退出
-
人物-账号管理
-
实物-显示器
-
操作-删除
-
指向-bottom
-
指向-left
-
指向-left_double
-
指向-right_double
-
指向-top
-
指向-right
-
实物-摄像头
-
符号-视频
-
操作-搜索
-
图表-折线图
-
符号-文档
-
图表-仪表盘
-
图表-柱状图
-
符号-附件
-
操作-排序-降序
-
人物-搜索
-
操作-排序-升序
-
人物-人
-
人物-增加
-
操作-上传-upload
-
符号-日期-实色
-
操作-设置
-
操作-收藏-line
-
符号-首页
-
实物-手机
-
操作-打印
-
实物-书
-
人物-团队
-
操作-刷新
-
符号-位置
-
操作-上传-download
-
符号-新闻-线性
-
图表-流程
-
图表-饼图
-
符号-下拉
-
符号-标签
-
符号-步骤条
-
符号-菜单
-
符号-穿梭框
-
符号-单行输入框
-
符号-多选
-
符号-迭代器
-
符号-单选
-
符号-多行输入框
-
符号-分栏
-
符号-富文本
-
符号-级联选择
-
符号-警告提示
-
符号-复选择器
-
符号-链接块
-
符号-列表容器
-
符号-轮播图
-
符号-容器
-
符号-筛选
-
符号-时间轴
-
符号-树选择器
-
符号-数据矩阵
-
符号-数字输入框
-
符号-图片上传
-
符号-图片
-
符号-文本
-
符号-下拉单选
-
符号-Dialog
-
符号-文字提示
-
符号-选项卡
-
符号-折叠面板
-
符号-html
-
下载文件
-
数据
-
操作-评星-full
-
树
-
进度-line
-
上传文件
-
音乐
-
new-window-1
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"。