H5学习笔记Web前端之路Web 前端开发

通过icomoon生成并使用字体图标

2017-04-11  本文已影响31人  夜凉听风雨

进入网站 https://icomoon.io/

点击icomoon app

图片.png

选择图标或者导入本地图标

图片.png

在阿里巴巴矢量图库里可以免费下载到SVG格式图标。
链接地址:http://www.iconfont.cn/

导入完图片 生成字体

图片.png

配置字体,下载压缩包

图片.png

解压缩后,将红框里的文件拷贝到项目中

图片.png

修改一下style.css里面的路径

图片.png

可以看到css文件里都是生成的字体图标对应的类名和编码

图片.png

在需要使用字体图标的地方导入style.css文件 为需要添加图标位置的标签添加与该图标对应的类icon-xxxx

图片.png
上一篇下一篇

猜你喜欢

热点阅读