在学习了上一篇导入阿里巴巴矢量图库的图标方法后https://www.cnblogs.com/en1302coling/p/11439590.html
这里还有一种导入方法
首先，把想要的图标添加入项目，点击Unicode显示代码，并点击复制代码
将复制的代码黏贴到app.wxss，并修改iconfont的样式，并将每个icon的名字赋予相应的代码编号，如下图所示：
例子：
在微信开发工具，*.wxml中写入想要的代码
<view class="item3"> <view class="itemClass"> <icon class="iconfont icon-localmusic"></icon> <text class="text">本地音乐</text> <view class="divline1"></view> </view> <view class="itemClass"> <icon class="iconfont icon-zuijinbofang"></icon> <text class="text">最近播放</text> <view class="divline1"></view> </view> <view class="itemClass"> <icon class="iconfont icon-download"></icon> <text class="text">下载管理</text> <view class="divline1"></view> </view> <view class="itemClass"> <icon class="iconfont icon-radio"></icon> <text class="text">我的电台</text> <view class="divline1"></view> </view> <view class="itemClass"> <icon class="iconfont icon-collect"></icon> <text class="text">我的收藏</text> <view class="divline1"></view> </view> </view>
在*.wxss中设置样式
.item3{ background: #ffffff; } .itemClass{ height: 80rpx; } .text{ font-size: 15px; margin-left: 50rpx; } .divline1{ background: rgba(238, 236, 236, 0.781); width: 90%; height: 0.1rpx; margin-left: 100rpx; margin-top: 20rpx; }
打开app.wxss,将复制的相关代码黏贴并赋值
@font-face { font-family: ‘iconfont‘; /* project id 1359989 */ src: url(‘//at.alicdn.com/t/font_1359989_5h4uou7la6m.eot‘); src: url(‘//at.alicdn.com/t/font_1359989_5h4uou7la6m.eot?#iefix‘) format(‘embedded-opentype‘), url(‘//at.alicdn.com/t/font_1359989_5h4uou7la6m.woff2‘) format(‘woff2‘), url(‘//at.alicdn.com/t/font_1359989_5h4uou7la6m.woff‘) format(‘woff‘), url(‘//at.alicdn.com/t/font_1359989_5h4uou7la6m.ttf‘) format(‘truetype‘), url(‘//at.alicdn.com/t/font_1359989_5h4uou7la6m.svg#iconfont‘) format(‘svg‘); } .iconfont { font-family: "iconfont" !important; margin-left: 20rpx; font-size: 20px; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .icon-localmusic:before{content: ‘\e6b4‘;} .icon-zuijinbofang:before{content: ‘\e605‘;} .icon-download:before{content: ‘\e67d‘;} .icon-radio:before{content: ‘\e608‘;} .icon-collect:before{content: ‘\e61e‘;} .icon-heart:before{content: ‘\e632‘;}
保存即可导入想要的图标