在小程序样式文件中,如果设置背景图片的路径用的是本地的,就会报错并且显示不出来;如果在wxml文件中使用图片的本地路径作为背景图,则微信开发者工具中可以显示出来,但是运行到手机上显示不出来,解决方法如下:

方法一:

使用网络图片

background: url('https://cdn.ctoku.com/1123123123123e3241.png') no-repeat center;

方法二:

在线搜索图片转Base64编码
http://www.jsons.cn/img2base64/

  background: url('data:image/png;base64,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') no-repeat center;

方法三:

使用<image/>标签

 <image src="/public/image/photo_sure.png" ></image>

【微信小程序】不支持使用本地图片设置背景图片解决方法相关推荐

  1. 微信支付服务商,![CDATA[sub_mch_id与sub_appid不匹配],微信小程序支付,签名错误,CDATA[签名错误]解决方法,支付签名验证失败

    微信支付服务商,微信小程序支付,签名错误,CDATA[签名错误]解决方法 1:服务商和普通的商户支付在代码上没有太大差异(不同的是上传的参数,而且微信支付服务商参数上比较难找,官方文档又太简洁,所以很 ...

  2. 微信小程序JSjavascript中的Math.pow()函数负数开立方解决方法

    微信小程序JSjavascript中的Math.pow()函数负数开立方解决方法 Math.pow()函数是不能负数开立方的,会返回Null,因为对于计算机而言,负数开三次方是一个复数(实际上负数开三 ...

  3. 微信小程序手机号解密报错:pad block corrupted 解决方法

    微信小程序手机号解密报错:pad block corrupted 解决方法 微信小程序获取用户手机号,后端解密手机号的时候偶尔会报错 javax.crypto.BadPaddingException: ...

  4. 微信小程序使用swiper制作轮播图留白的解决方法

    微信小程序相比网页制作轮播图快捷了很多,直接可以使用swiper标签,但是对于新手来说,也有很多不可避免的坑. 附上轮播图代码 <view class="swp">&l ...

  5. 微信小程序出现【需要进行身份验证】弹框解决方法

    2019独角兽企业重金招聘Python工程师标准>>> 问题 在做微信小程序时,需要使用 Authorization 进行授权,结果每次登录的时候都出现这个弹窗. 原因 部分代码如下 ...

  6. 微信小程序音频或视频拖动进度条时间不变解决方法

    问题描述: 微信小程序在较新版本的音频接口中推荐使用InnerAudioContext对象实现音频的播放.暂停.跳转等功能,通过监听接口回调实现. InnerAudioContext.onTimeUp ...

  7. 微信小程序解密encryptedData报错:pad block corrupted 解决方法

    今天碰到一个pad block corrupted错误,跟代码发现是Cipher里面的doFinal()爆出的错. 代码: public static JSONObject getUserInfo(S ...

  8. 微信小程序page页面下有多余空白区域(解决方法)

    出现的问题是这样子的: 仔细检查,是因为自定义组件导致的问题,但是组件中对高度没有定义,应该是自适应的. 解决方法: 在使用自定义组件的外面套上一层层view,然后给它设置高度并设置超出部分隐藏即可. ...

  9. 微信小程序- wx.showToast()一闪,停留时间过短(解决方法)

    使用计时器setTimeout来让提示语停留时间长些 setTimeout(() => {wx.showToast({title: res.data.msg,icon: "error& ...

最新文章

  1. 对不起,让你笑了这么久!
  2. 某阿里程序员女朋友吐槽男友整天玩失踪!早晨问候一声,晚上十一点才回信息!中间完全消失!阿里加班真的这么恐怖吗?...
  3. 原创 | 数据资产确权浅议
  4. python 协程并发
  5. Centos6.9部署ORTS5.0.22
  6. 8/100. Find All Numbers Disappeared in an Array
  7. Gentoo解决Windows双系统时间不同步的问题
  8. jQuery源码阅读
  9. QTP教程01 - Add-in Manager插件介绍
  10. 阿里出品的最新版 Java 开发手册,嵩山版,扫地僧
  11. Fibonacci费氏数列
  12. Java代码-List集合求交集、补集(差集)
  13. plc虚拟服务器,VMware软件虚拟机和PLC通讯的连接方法
  14. 微信 Android 模块化架构重构实践
  15. 快速计算平方根数(约翰·卡马克)
  16. 10种人脉裂变技能,6个裂变核心,8个吸粉人性本能怎样玩粉丝裂变?
  17. Go slice和arry的区别
  18. Excel中 VLOOKUP 函数的使用
  19. 1-JVM之Java运行时数据区域
  20. NATAPP安装和配置(附加NATAPP后台运行)

热门文章

  1. 华为交换机审计配置_上网行为管理审计之交换机端口镜像配置(华为)
  2. 【Hard to Park】Estimating Parking Difficulty at Scale
  3. linux镜像文件没有gho,使用OneKey备份系统后找不到GHO系统文件解决方法
  4. 修改3389端口的方法?
  5. 携程梁建章:我的鼠标+水泥为什么成功
  6. IQ 域名被删除事件 的前因后果
  7. Erphplogin Pro 连接QQ/微博/微信登录/弹窗登录 WordPress插件
  8. 04 面向对象之:三大特性:继承,封装,多态
  9. X-Window结构分析与应用
  10. 硅谷码农35岁危机:Java之父也找不到工作