Iconfont使用手册

Iconfont是阿里巴巴的矢量图标库。本文将简要介绍如何快速上手使用Iconfont。自从用了Iconfont，图片不再模糊了。起因之前，项目中的logo等图片资源都是UI小的，姐姐设计好后，剪给我，然后我引入到项目中，如下：但这种方式有一个缺点，就是图片放大后，或者在高分辨率显示器下，底部会变得模糊，导致清晰度不够。对于高要求、高标准的场景，显然是不够的，所以团队商量决定使用Iconfont，这是一个矢量图片库，由UI小姐姐打造，将图片上传到阿里iconfont官网非常方便，然后在前端下载并导入。下载并使用登录Iconfont。在我的项目中，一共有三种形式。这里我一般选择Fontclass，然后点击Downloadtolocal，就会得到这样一个文件夹。复制下图中的五项，新建一个myfont文件夹（自定义名称，随便你）然后导入到你的html页面中最后，您可以在需要的地方使用它。ExtendedIconfont网站上有很多开源库，都是别人设计的。如果公司没有UI设计师，你也可以选一套自己组装，非常自由。当然还有矢量图库，FontAwesome等，也很不错。用法类似。