阿里巴巴矢量图标库

阿里巴巴矢量图标库简介

Iconfont.cn是由阿里巴巴UX部门推出的矢量图标管理网站,也是国内首家推广Webfont形式图标的平台。网站涵盖了1000多个常用图标并还在持续更新中,Iconfont平台为用户提供在线图标搜索、图标分捡下载、在线储存、矢量格式转换、个人图标库管理及项目图标管理等基础功能。同时iconfont.cn平台作为矢量图标倡导者,积极在线分享矢量图标制作经验、前端应用说明,及应用中常见的一些问题。

官网地址:http://www.iconfont.cn/

图标搜索

使用教程
  • 1 font-face声明字体

    @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的样式

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

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