在小程序中使用阿里巴巴矢量图标库的字体图标，http://www.iconfont.cn
首先在这个网站挑选合适的图标加入项目。
进入项目生成代码
点击下载至本地，打开下载下来的压缩包，编辑iconfont.css，找到
|
1 2 3 4 5 6 7 |
.iconfont { font-family:"iconfont" !important; font-size:16px; font-style:normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } |
将这段以上的代码替换为生成的unicode：
|
1 2 3 4 5 6 7 8 |
@font-face { font-family: 'iconfont'; /* project id 458248 */ src: url('//at.alicdn.com/t/font_458248_m3uvknr8kixdpldi.eot'); src: url('//at.alicdn.com/t/font_458248_m3uvknr8kixdpldi.eot?#iefix') format('embedded-opentype'), url('//at.alicdn.com/t/font_458248_m3uvknr8kixdpldi.woff') format('woff'), url('//at.alicdn.com/t/font_458248_m3uvknr8kixdpldi.ttf') format('truetype'), url('//at.alicdn.com/t/font_458248_m3uvknr8kixdpldi.svg#iconfont') format('svg'); } |
另存为iconfont.wxss,然后在项目中引用：
|
1 |
@import 'style/iconfont.wxss'; |
在项目中使用字体图标：
|
1 |
<i class='iconfont icon-shezhi'></i> |
文章评论 暂无评论
暂无评论