链上研发

链家上海研发中心攻城狮小分队

简易字体图标_0.0.2

简介

从最传统的小图标到雪碧图再到现在的字体图标,关于这一块的前端的优化目标一直未有变更,今天简单的介绍一下如何用最小的代价来应用字体图标

作者:链上研发-hcy
时间:2016-11-30

字体图标有何优缺点?

  • 轻量、灵活、兼容
  • 清晰不失真
  • 只能被渲染成单色或者CSS3的渐变色,创作自己的字体图标成本大

    回归主题,如何简易的来使用呢?

  • 阿里巴巴的矢量图库可以为我们所用

  • 地址:http://www.iconfont.cn/

我将一步一步讲述该如何使用

注册一个账户

  当然你可以使用其他账户来登陆,比如github的账户或者是新浪微博的账户,这都不是重点,重点是你要有一个账户

创建一个项目

  如下图所示,点击进去创建项目

附图

添加自选图标

  打开之后界面是这样的

附图

  之后去图库搜索自己想要的图标,加进你的'购物车'

附图

  之后点击一下购物车,把他添加到你的项目中即可

附图

导出到本地使用

  最后一步,导出到本地即可

附图

就是这么简单,你就可以使用字体图标
阅读更多
版权声明:本文为链家上海研发中心原创文章,转载请注明出处。 https://blog.csdn.net/fang_sh_lianjia/article/details/53412293
文章标签: 字体图标-前端
个人分类: Angular2
想对作者说点什么? 我来说一句

自定义字体图标文件

2016年08月30日 113KB 下载

fontawesome-4.2.0_ie7

2017年03月10日 340KB 下载

没有更多推荐了,返回首页

不良信息举报

简易字体图标_0.0.2

最多只允许输入30个字

加入CSDN,享受更精准的内容推荐,与500万程序员共同成长!
关闭
关闭