我们知道在PC端想在一个页面插入一张背景图上海seo学习想在一个页面插入一张背景图只需要如下属性即可。
在小程序里面如此做法就行不通了图片不但不会显示而且还会报错了
很多人都会有这样的一种感受在一边学习一遍做项目的过程中总会遇到很多坑今天给大家填坑如何给小程序页面插入一张背景图。 参考了一下小程序的参考手册:https://www.w3cschool.cn/weixinapp/weixinapp-qa.html 在网上浏览了一遍找到了几个比较靠谱的解决方案简单方便。
解决方案: 解决方法一: 在使用背景图片的时候用网络图片就是用外链的形式比如你将这张图片放到你的服务器如:https://xxxx/xxx.jpg; 1:用工具连接服务器
2:将桌面的图片拖入指定服务器文件夹底下 3:得到图片网络连接添加到代码中则可以显示背景图片
解决方法二: 将背景图片使用编码base64进行转换可以在这个网址进行 转换如:background-image: url("转换后得到的编码文本")如果多次使用的话可以将该值设置为全局变量再在js文件进行引用即可; 1:打开在线图片转换平台
2:将桌面的图片导入生成base64编码
3:将第三方平台编译过后的base64编码复制到wxss里面
// Base64 在wxss中的使用
page{
background-image: url(""data:image/jpg;base64,/9j/4AAQSkZJRgABAQEA....");
}
4:效果如下: