css使用字体图标

1、下载字体图标
阿里巴巴字体图标库：www.iconfont.cn/ icomoon字体图标库：icomoon.io/
解压下载的字体图标库
将解压的所有文件放到项目中的font文件夹下（切记保存所有的文件）
2、使用字体图标
1.定义字体
@font-face {
font-family: 'iconfont';
src: url('iconfont.eot');
src: url('iconfont.eot?#iefix') format('embedded-opentype'),
url('iconfont.woff2') format('woff2'),
url('iconfont.woff') format('woff'),
url('iconfont.ttf') format('truetype'),
url('iconfont.svg#iconfont') format('svg');
}
注意路径
2.定义使用字体图标的样式
.myIconFont {
font-family: "iconfont" !important;
font-size: 16px;
font-style: normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
3.运用伪元素实现字体图标中某个图标的使用
.myfont1::before{
content:"\eb63";//这里的值为你需要使用的某个图标的编码，可在下载的字体图标文件夹中的demo_index.html中看到
}
4.html中调用样式