营销型网站一站式服务,免备案免费虚拟主机,网站开发公司前台模板,网页设计100个方法在编写小程序的样式文件时#xff0c;可以使用 background-image 属性来设置元素的背景图像#xff1b;但是这个属性在微信小程序中使用时存在坑#xff1b;
注意事项#xff1a;微信小程序中的 background-iamge 不支持本地路径#xff01;需要使用网络图片#xff0c;…在编写小程序的样式文件时可以使用 background-image 属性来设置元素的背景图像但是这个属性在微信小程序中使用时存在坑
注意事项微信小程序中的 background-iamge 不支持本地路径需要使用网络图片或者 base64或者使用 image 组件
打开微信开发者工具在 index.wxml 文件最底部添加一行代码
view classbg-image/view在 index.scss 中添加样式进行测试
.bg-image{height: 400rpx;// 小程序背景图的地址不能写本地路径写本地路径的图片无法展示background-image: url(../../assets/bgimage.png);// 可以使用网络图片代替本地图片background-image: url(http://8.131.91.46:6677/bgimage.png);// 也可以将本地图片转为 base64 进行展示由于 base64 数据太长这里不进行演示background-image: url(data:image/png;base64,iVB*****);
}对应的图片可以从 gitCode 中进行下载图片源自尚硅谷非个人所有无意冒犯
参考视频尚硅谷微信小程序开发教程
