欢迎光临
我们一直在努力

阿里巴巴矢量图标库怎么用(完整使用方法讲解)

现在网络上有很多矢量图标库,但是能自定义的却很少,不能自定义的体积就很大,造成不必要的浪费。阿里巴巴矢量图标库Iconfont很好的规避了这个问题,能够自定义添加图标到你定义的项目中,运用也很简单。

选择图标

打开阿里巴巴矢量图标库首页,选择你心仪的库,这里可以随便选择,可以组合的,如下图: 阿里巴巴矢量图标库Iconfont的使用方法

阿里巴巴矢量图标库的使用方法

选择具体图标,添加入库 阿里巴巴矢量图标库Iconfont的使用方法

右上方,点击库查看已经入库的图标,并添加至项目。也可以直接下载,点击下载素材,选择颜色,格式(SVG、AI、PNG),完成下载。 阿里巴巴矢量图标库Iconfont的使用方法

添加至项目后,可以在图标管理=>我的项目中查看已经添加的图标 阿里巴巴矢量图标库Iconfont的使用方法

运用到项目

阿里巴巴矢量图标库Iconfont的使用方法

unicode引用

unicode是字体在网页端最原始的应用方式,特点是:

  • 兼容性最好,支持ie6+,及所有现代浏览器。
  • 支持按字体的方式去动态调整图标大小,颜色等等。
  • 但是因为是字体,所以不支持多色。只能使用平台里单色的图标,就算项目里有多色图标也会自动去色。
  • 注意:新版iconfont支持多色图标,这些多色图标在unicode模式下将不能使用,如果有需求建议使用symbol的引用方式

    是不是so easy,以后在你的项目中就可以使用矢量图标了,而且阿里提供很多种,供大家选择使用,都是免费的哦。

    赞(0)
    版权声明:本文采用知识共享 署名4.0国际许可协议 [BY-NC-SA] 进行授权
    文章名称:《阿里巴巴矢量图标库怎么用(完整使用方法讲解)》
    文章链接:https://www.6buu.com/244361.html
    本站资源仅供个人学习交流,不允许用于商业用途,否则法律问题自行承担。

    评论 抢沙发