-
选择图标,加入购物车
-
购物车>下载代码,解压,打开其中的iconfont.css
-
购物车>添加至项目,没有项目创建一个。
-
首页上方菜单栏,图标管理>我的图标,选择我的项目,点击【暂无代码,点此生成】
-
复制生成的代码,替换掉打开的iconfont.css中的@font-face那一大段
-
将替换完的代码复制到wxss中。在对应wxml中使用,类名iconfont固定都要写,第二个类名为选择的图标的类名
<!--wxml使用示例--> <text class="iconfont icon-duihao"></text>
替换完的代码示例
/*生成的 @font-face 替换掉原来的 @font-face */ @font-face { font-family: 'iconfont'; /* project id 1389446 */ src: url('//at.alicdn.com/t/font_1389446_db28xhm4e.eot'); src: url('//at.alicdn.com/t/font_1389446_db28xhm4e.eot?#iefix') format('embedded-opentype'), url('//at.alicdn.com/t/font_1389446_db28xhm4e.woff2') format('woff2'), url('//at.alicdn.com/t/font_1389446_db28xhm4e.woff') format('woff'), url('//at.alicdn.com/t/font_1389446_db28xhm4e.ttf') format('truetype'), url('//at.alicdn.com/t/font_1389446_db28xhm4e.svg#iconfont') format('svg'); } /*所有引用都得写这个类名*/ .iconfont { font-family: "iconfont" !important; font-size: 16px; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } /*这两个是对号和加号的类名*/ .icon-duihao:before { content: "\e633"; } .icon-jiahao:before { content: "\e61c"; }
添加阿里矢量图标到微信小程序
最新推荐文章于 2023-07-02 16:03:03 发布