1、在蚂蚁贴图库中(http://iconfont.cn/)选择一个或多个喜欢的图标,效果如下图所示
2、网页右上角的小购物车
3、这里决定下载代码。 下载后,在项目需要的地方解压缩。
4、这是我下载的压缩文件和解压缩的文件。
5、下载后,可以看到三个html文件。 我们在浏览器中打开。 他用引入三个图标的方法,我们根据自己的需要自己选择。
6、举个例子,我喜欢个人使用
创建新文件夹。 名字自己取吧。 我的是字体。 放入这四个文件。 与font对等放置iconfont.css
html样式:
. iconfont{ color: blue; }
@font-face {
font-family: 'iconfont ';
SRC:URL(font/iconfont.EOT );
SRC:URL(font/iconfont.EOT? #iefix ' )格式(嵌入式开放)、
URL(font/iconfont.woff ) (格式) woff )、
URL(font/iconfont.TTF ) (格式) (truetype )、
URL(font/iconfont.SVG#iconfont ) (格式) (SVG );
}
. iconfont{
font-family:'iconfont '! 导入;
font-size:16px; 字体样式: normal;
微信字体智能: antialiased;
- WebKit-text-stroke-width :2 px;
- moz-OS x-font-smoothing : gray scale;
}
body中
实体
ul
lia href=' '! - iclass=' iconfonticon-yifu '/I-- 1男装/女装/a/li
lia href=' '! - span class=' iconfonticon-15 '/span---- 2鞋/包/a/li
lia href=' ' iclass=' icon font ' # x e666; /i3家具/a/li
lia href=' ' iclass=' icon font ' # xe60f; /i4家具/a/li
lia href=' ' iclass=' icon font ' # x 3446; /i5家具/a/li
/ul
/body
所有这些图标都可以视为字体,与文字相同,例如改变颜色大小。