• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    公众号

微信小程序中使用iconfont图标

原作者: [db:作者] 来自: [db:来源] 收藏 邀请

1、在阿里巴巴的iconfont网站,创建自己的项目

 

 

2、依次挑选图标到购物车

 

 

3、图标挑选完毕后,将购物车的图标添加到所属项目中

 

 4、进入我的项目,默认是不生成代码的,需要在红框处点击生成,然后根据下面的路径跳转,拷贝生成好的css样式文件

 

 5、将生成的css样式文件,复制到项目中,比如是  style/iconfont/inconfont.wxss

 

 6、在app.wxss中引用这个css文件,这样以后所有页面只需要应用就可以了

@import "style/iconfont/iconfont.wxss"

 

7、页面具体使用:   (iconfont是外部样式表文件名  后面的iconcloud可在iconfont项目对应的图标上点击复制即可)
<view class="middle-item-top">
<text>2月20日明天</text>
<text class="iconfont iconcloud"></text>
<text>10℃ / 1℃</text>
</view>

 

 

 

备注:iconfont也提供其他方式的图片导入

 

 

 


鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
上一篇:
微信小程序实现websocket长连接以及断开连接之后自动重连发布时间:2022-07-18
下一篇:
小程序 自定义alert弹窗 带动画发布时间:2022-07-18
热门推荐
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap