1200字范文,内容丰富有趣,写作的好帮手!
1200字范文 > 【阿里巴巴矢量图库搭建一个属于自己的字体图标库iconfont】

【阿里巴巴矢量图库搭建一个属于自己的字体图标库iconfont】

时间:2019-10-03 14:33:15

相关推荐

【阿里巴巴矢量图库搭建一个属于自己的字体图标库iconfont】

此篇文章适用于小白,希望对你们的开发之路有所帮助,为你扫清障碍!!!

如果你是一个前端开发者,那么你会收到一个psd格式的设计图,或者会加入公司的项目会有设计师拉你进蓝湖项目,那么此次我将用蓝湖设计图进行说明如何创建字体图标库,如下步骤:

1.打开蓝湖设计图,在切图的位置下拉选项卡选择svg格式的切图进行下载

2.下载完成后,你会得到一个xxx.svg的一个文件,你可以进行重命名

3.打开阿里巴巴矢量图库,登录你自己的账号,点击红色框的位置你会看到如下界面

4.把你之前在蓝湖下载的svg文件拖拽到第三步的这个界面之内,然后上传图标,去除颜色,或者不去颜色随你自己

5.提交之后,在管理资源=>我的资源下面看到之前上传的图标

6.点击批量操作=>选择批量加入购物车

7.你就可以在你的购物车内看到你刚才选择的图标,并且将它们添加至你的项目就可以了

8.FontClass,点击红色文字更新代码,把里面的代码复制到你开发的项目中取对应的类名就可以使用了

9.封装一个icon组件`

<icon class=“cencobuy-iconfont " :class=”[icon]" type="" :style="{fontSize: size + ‘rpx’,color: color,lineHeight:size + ‘rpx’}"

@click=“click”>

`

10.在项目使用这个组件,取类名即可

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。