您的位置:首页 > 其它

还在为小图标不能适应各种设备发愁吗?iconfont为你解决所有问题

2016-03-30 15:38 501 查看
我看到我们网站的图标还用的图标来做的时候,我感叹了下,失真严重啊,gif动画图标锯齿那个严重啊,看不下去了,我给大家分享下我已经用了很久的一种技巧,现在移动设备,微信公众号,包括很多网站都已经用上了字体图标的方式来显示小图标了(iconfont),和文字一样,不会有失真,而且配合css3的动画基本能替代很多的gif动画。还有个好处就是字体文件比图片小很多,还提供不同的很多字体格式,只要不是太落后的浏览器都没问题





下面给大家介绍下怎么制作图标字体,阿里旗下的这个网站有非常丰富的图标资源:http://www.iconfont.cn
1、从http://www.iconfont.cn 找到你想要的图标,以svg格式下载到本地,想要多少下载多少
2、https://icomoon.io/app/#/select 打开这个网站我们就可以制作自己的图标字体了,点击import
icons 按钮,把下载的svg格式图标导入进来,然后你就能在线看到你导入的图标,宾且可以进行在线编辑,编辑功能非常强大,完全够用





3、导入编辑好后,选中你想要的图标,点击右下角的生成字体按钮,会自动生成好字体,下载后,压缩包里包含了css样式,直接用就是了,非常方便



内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: