预览字体
-
!
\21exclam
-
"
\22quotedbl
-
#
\23numbersign
-
$
\24dollar
-
%
\25percent
-
&
\26ampersand
-
'
\27quotesingle
-
(
\28parenleft
-
)
\29parenright
-
*
\2aasterisk
-
+
\2bplus
-
,
\2ccomma
-
-
\2dhyphen
-
.
\2eperiod
-
/
\2fslash
-
0
\30zero
-
1
\31one
-
2
\32two
-
3
\33three
-
4
\34four
-
5
\35five
-
6
\36six
-
7
\37seven
-
8
\38eight
-
9
\39nine
-
:
\3acolon
-
;
\3bsemicolon
-
<
\3cless
-
=
\3dequal
-
>
\3egreater
-
?
\3fquestion
-
@
\40at
-
A
\41A
-
B
\42B
-
C
\43C
-
D
\44D
-
E
\45E
-
F
\46F
-
G
\47G
-
H
\48H
-
I
\49I
第一步:使用font-face声明字体
@font-face {
font-family: 'fonteditor';
src: url('fonteditor.eot'); /* IE9*/
src: url('fonteditor.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
url('fonteditor.woff') format('woff'), /* chrome、firefox */
url('fonteditor.ttf') format('truetype'), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
url('fonteditor.svg#uxfonteditor') format('svg'); /* iOS 4.1- */
}
第二步:定义使用fonteditor的样式
.fonteditor {
font-family:"fonteditor" !important;
font-size:16px;font-style:normal;
-webkit-font-smoothing: antialiased;
-webkit-text-stroke-width: 0.2px;
-moz-osx-font-smoothing: grayscale;
}
第三步:挑选相应图标并获取字体编码,应用于页面
<i class="fonteditor">3</i>