400-6446-365

网站设计中阿里巴巴矢量图标库的使用方法

2020-08-02

  今众多的Web前端设计都采用了阿里巴巴矢量图标库来制作网页中的小图标,图标库是开放的,可以在线或下载使用。本文中,北京分形科技,北京高端网站建设网站设计公司,就来介绍一下阿里巴巴矢量图标库的使用方法。


上传图片 [574x346]


  按照程序下载脚本文件中的cdemo_symbol.html在本页面显示内容的程序提示步骤进行程序调用。例如需要调用你的购物车和调用鱼缸的图标,我们需要书写的在shtml中的代码格式,如果我们需要行增加标签样式,则增加样式中的代码将会作用在这个标签上。

  symbolo这是一种全新的用户使用体验方式,应该可以说这才真正是未来的使用主流,也是这个平台目前比较推荐的一种用法。这种图标用法其实更像是自己做了一个基于svg的图标集合,与另外两种用法相比比它具有更多如下几个特点:已经支持多色矩形图标了,不再需要受其他单色图标限制。通过一些实用技巧,支持像其他字体那样,通过fofont-size,color来自动调整字体样式。兼容性相对较差,支持ie6,ie9+,及其他现代网页浏览器。

  浏览器端在渲染一个svg的时候性能一般,还远远不如渲染png。总结:虽然现在已经有了一个iconfont图标资源库,但它还不是万能的,毕竟它不能100%完全满足我们的使用需求,有时候我们只是需要一些特别类似icont的图标,就不再需要我们自己动手制作了。

  目前我们在对cweb等的前端开发工作中最基本需要深入了解的也就是显示svg格式的这个图标,一些大型门户网站已经逐渐开始广泛运用了解到了这个图标技术。

  更多网站设计,网页设计等相关信息,欢迎您咨询北京分形科技!
TAG标签耗时:0.0020310878753662 秒
010-64928252/400-6446-365 我现在就想找顾问聊聊
让决策变的简单
好的开始是成功的一半
您需要 AI+互联网
顾问提供专业咨询
AI人工智能 · VR · AR · 智慧博物馆 · 智慧公园 · 景区 · 文创 · 动画
高端网站建设 · 小程序 · APP · 微信 · H5 · 游戏 · 电商 · 年度运营