摘要：下载并使用登录，在我的项目中，共有三种形式，这里我一般选择然后点击下载至本地，会得到这样一个文件夹。
Iconfont是阿里巴巴矢量图标库，本文将简单介绍如何快速上手使用Iconfont，自从用上Iconfont后，图片再也不糊了起因
之前，项目中的logo等图片资源都是UI小姐姐设计好后切给我，然后我将其引入项目中，如下形式：
但这种方式有一个弊端，就是图片放大后，或者在高分辨率的显示器下面会变得模糊，导致不够清晰，对于一个有高要求高标准的场景而言，显然是不够的，于是团队讨论，决定用上Iconfont，这是一种矢量图片库，由UI小姐姐将图片传到阿里Iconfont网站，然后前端下载并引入即可，非常方便。
下载并使用登录Iconfont，在我的项目中，共有三种形式，这里我一般选择Font class, 然后点击下载至本地，会得到这样一个文件夹。
将下图中五项copy出来，新建一个myfont文件夹（自定义命名，随便你）
然后，在你的html页面中引入进来
最后，在需要的地方使用即可
延伸
Iconfont网站上有很多开源的库，别人已经设计好了，如果公司没有UI设计师，你也可以选择一套自己进行组装，非常自由，当然，矢量库还有，Font Awesome 等，也非常不错，用法嘛，都是大同小异。
文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。
转载请注明本文地址：https://www.ucloud.cn/yun/53329.html
摘要：下载并使用登录，在我的项目中，共有三种形式，这里我一般选择然后点击下载至本地，会得到这样一个文件夹。 Iconfont是阿里巴巴矢量图标库，本文将简单介绍如何快速上手使用Iconfont，自从用上Iconfont后，图片再也不糊了 起因 之前，项目中的logo等图片资源都是UI小姐姐设计好后切给我，然后我将其引入项目中，如下形式： 但这种方式有一个弊端，就是图片放大后，或者在高分辨率...
摘要：之前用的技术栈都是上找的的脚手架，第一次看项目的源码。感觉一个文件里包含模板对应和样式的组合方式，使得组件化更加明显，也降低了平时项目中的小文件数量。相比于的，使用在原生标签里插入属性和一些模板表达式来展示数据，显得简洁了许多。 之前用的技术栈都是yeoman上找的webpack+react的脚手架，第一次看vue项目的源码。感觉一个vue文件里包含html模板、对应JS和样式的组合方...
摘要：与使用方式相比，具有如下特点兼容性良好，支持，及所有现代浏览器。相比于语意明确，书写更直观。不过因为本质上还是使用的字体，所以多色图标还是不支持的。一、准备阶段： a.进入阿里巴巴矢量图标库www.iconfont.cn挑选所需的图标，加入购物车 b.点击网页中的购物车下载代码 二、3种方法实现 Iconfont 的HTML显示 Unicode 引用 Unicode...
摘要：方式和方式是极其相似的，只不过他们一个用的是图标的字体编码，一个用的是图标的引用而已是使用了引用的类名，可在下载的中查看，或者可以在阿里矢量图标库的网站上，进入我的项目查看。 字体图标iconfont阿里官网传送门： http://www.iconfont.cn/打开首页的小图标好漂亮哦1）showImg(https://segmentfault.com/img/bVbghOc?w=1...
阅读 3953·2021-09-22 16:03
阅读 5268·2021-09-22 15:40
阅读 1129·2021-09-06 15:02
阅读 852·2019-08-30 15:53
阅读 2157·2019-08-29 15:35
阅读 1089·2019-08-23 18:22
阅读 3319·2019-08-23 16:06
阅读 623·2019-08-23 12:27
