本文主要是介绍Iconfont-阿里巴巴矢量图标库(笔记),希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!
使用
用户在iconfont.cn可以下载,多种格式的icon,平台也可将图标转换为字体,便于前端工程师自由调整与调用。
注:图标下载在“我的项目”:
一、icon单个使用
下载格式包括:svg,png
二、使用
1、unicode引用
特点:
兼容性最好
支持按字体的方式去动态调整图标大小,颜色
不支持多色,单色的图标
注:symbol的引用方式支持多色
html文件:
css文件:
2、font-class引用
特点:
兼容性良好,支持ie8+,及所有现代浏览器;
相比于unicode语意明确,书写更直观;
修改class里面的unicode引用;
多色图标还是不支持的;
3、symbol引用
特点:
支持多色图标了,不再受单色限制。
通过一些技巧,支持像字体那样,通过font-size,
color
来调整样式。
兼容性较差,支持 ie9+,及现代浏览器。
浏览器渲染svg的性能一般。
这篇关于Iconfont-阿里巴巴矢量图标库(笔记)的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!