iconfont.cn 阿里出品的矢量图标库

2014-10-22 482 0

Iconfont.cn是阿里巴巴推出的矢量图标库,其中涵盖了1000多个常用图标,并在持续更新中。(目前已有7000+图标,部分图标为用户上传,因此默认不公开,但是可以搜索到。)

iconfont

 

Iconfont提供以下功能:

  • 在线图标搜索
  • 图标分捡下载
  • 在线储存
  • 矢量格式转换
  • 图标库管理

iconfont的优势

  • 自由变化大小(高清屏无压力)
  • 自由修改颜色(纯色)
  • 可以添加一些视觉效果如:阴影、旋转、透明度

iconfont使用

  1. 声明字体

    @font-face {font-family: ‘iconfont’;
    src: url(‘iconfont.eot’); /* IE9*/
    src: url(‘iconfont.eot?#iefix’) format(‘embedded-opentype’), /* IE6-IE8 /
    url(‘iconfont.woff’) format(‘woff’), /
    chrome、firefox /

    url(‘iconfont.ttf’) format(‘truetype’), /
    chrome、firefox、opera、Safari, Android, iOS 4.2+/

    url(‘iconfont.svg#iconfont’) format(‘svg’);
    / iOS 4.1- */
    }
    `

  2. 定义样式

    `.iconfont{font-family:"iconfont";font-size:16px;font-style:normal;}`
  3. 选择图标、获取字体编码,应用于页面

    `<i class="iconfont">&#33</i>

相关文章

15年来的手艺之路:手艺人赵鹏的自述
纪念 Google 25 周年:从搜索引擎到科技巨头的演变之路
1小时编写一个支持七牛上传的 markdown 客户端3(打包发布篇)
1小时编写一个支持七牛上传的 markdown 客户端2(代码优化篇)
1小时编写一个支持七牛上传的 markdown 客户端1(技术实现篇)
从 wordpress 转移到 hexo

Leave a Reply