微信小程序线上加载使用iconfont问题

1.在微信小程序根目录下创建style文件夹,里面再创建iconfont文件夹,用于放置iconfont图标文件和iconfont样式文件

 

2.给iconfont.wxss写样式(也可以下载iconfont代码,拷贝iconfont.css里的代码复制进去)

@font-face {
  font-family: "iconfont"; /* Project id 4251914 */
  src: url('//at.alicdn.com/t/c/font_4251914_74nkylmquia.woff2?t=1694676186559') format('woff2'),
  url('//at.alicdn.com/t/c/font_4251914_74nkylmquia.woff?t=1694676186559') format('woff'),
  url('//at.alicdn.com/t/c/font_4251914_74nkylmquia.ttf?t=1694676186559') format('truetype');
}

.iconfont {
  font-family: "iconfont" !important;
  font-size: 16px;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-shanchu:before {
  content: "\e74b";
}

.icon-shezhi:before {
  content: "\e74c";
}

.icon-shouyefill:before {
  content: "\e750";
}

.icon-shouye:before {
  content: "\e751";
}

.icon-zuobiao:before {
  content: "\e769";
}

.icon-xiangyou1:before {
  content: "\e775";
}

.icon-xiangzuo1:before {
  content: "\e779";
}

.icon-xiangji1fill:before {
  content: "\e77e";
}

.icon-xiangji1:before {
  content: "\e77f";
}

.icon-yonghufill:before {
  content: "\e787";
}

.icon-yonghu:before {
  content: "\e788";
}

3.点击更新(生成代码)

4.复制线上链接到iconfont.wxss中,使用和

5.把iconfont引入微信小程序(在app.wxss)


6.iconfont在页面中的使用

<icon class="iconfont icon-followed"></icon>

ps:线下使用icon链接:解决微信小程序离线加载iconfont问题_微信小程序离线使用_theOtherSky的博客-CSDN博客

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
微信小程序是一种轻量级的应用程序,可以在微信内部直接使用,无需下载安装。对于水果店来说,利用微信小程序可以更好地拓展业务、提高客户满意度,进而实现业绩逆袭。以下是微信小程序线上水果店的一些实现方法和步骤: 1.设计小程序页面 水果店的小程序需要有一个美观、易用的界面,以吸引用户的注意力。可以根据自己的需求选择不同的模板,或者自己设计页面。 2.添加商品信息 在小程序中添加水果店的商品信息,包括商品名称、价格、图片等。可以通过后台管理系统来添加商品信息。 3.设置购物车功能 在小程序中添加购物车功能,用户可以将自己需要购买的商品添加到购物车中,方便用户进行批量购买。 4.设置订单功能 在小程序中添加订单功能,用户可以在小程序中下单购买商品,商家可以在后台管理系统中查看订单信息。 5.设置支付功能 在小程序中添加支付功能,用户可以通过微信支付进行支付,商家可以在后台管理系统中查看支付信息。 6.设置物流功能 在小程序中添加物流功能,用户可以在小程序中查看订单的物流信息,商家可以在后台管理系统中更新物流信息。 7.设置客服功能 在小程序中添加客服功能,用户可以通过小程序向商家咨询问题,商家可以在后台管理系统中回复用户的问题。 8.推广小程序 可以通过微信公众号、微信群、微信朋友圈等方式来推广小程序,吸引更多的用户使用

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值