IconFont 图标
-
K
图片K
-
D
展开D
-
z
电话z
-
i
icon_音量i
-
A
关闭A
-
J
表情J
-
T
删除T
-
d
切换相机d
-
R
视频R
-
C
窗口 最小化C
-
l
摄像头l
-
L
加L
-
a
视频a
-
U
地理方位U
-
e
mic-ce
-
F
群组F
-
H
arrow_lH
-
I
arrow_rI
-
V
logoV
-
j
感叹号j
-
S
文件S
-
b
固定放大b
-
c
固定缩小c
-
O
恶魔O
-
k
感叹号k
-
M
设置M
-
P
减P
-
W
rightW
-
E
消息E
-
X
hyphenateX
-
G
搜索G
-
Q
退出Q
-
B
最大化B
-
h
iconfont-video2h
-
f
iconfont-mic2f
-
m
iconfont-Volume2m
-
N
聊天-群聊N
-
Z
音乐Z
-
n
黑名单n
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)需要修改为你项目下的font-family。可以通过编辑项目查看,默认是"iconfont"。