阿里巴巴矢量库的使用
1.登录http://www.iconfont.cn 可以用github帐号登录2.点击导航栏上的图标库3.选择自己需要的图标,加入购物车4.点击右上角购物车5.点击添加至项目,没有项目要新建一个6.在新打开的页面,点击Font class和查看在线链接下面就是如何在项目中使用.本例以vue-cli搭建的项目为例1.首先在index.html页面引入我们...
·
1.登录http://www.iconfont.cn 可以用github帐号登录
2.点击导航栏上的图标库
3.选择自己需要的图标,加入购物车
4.点击右上角购物车
5.点击添加至项目,没有项目要新建一个
6.在新打开的页面,点击Font class和查看在线链接
下面就是如何在项目中使用.本例以vue-cli搭建的项目为例
1.首先在index.html页面引入我们添加的图标样式
http: 后面的部分就是在线链接显示的url
2.具体使用
之前的界面
现在来添加图标,比如我们要使用支付宝钱包的图标
点击复制代码,然后在页面中使用,比如在<H1>的下面使用
<template>
<div class="hello">
<h1>{{ msg }}</h1>
<i class="iconfont icon-rectangle390"></i>
<h2>Essential Links</h2>
其中红色部分是固定写法,后面就是你需要的图标样式
稍微修改下样式,改变颜色,增加字体大小
最后效果图
简单的使用到此就OK了
更多推荐
已为社区贡献4条内容
所有评论(0)