小程序如何使用本地图片做背景

江河/ 2023年07月25日/ 小程序/ 浏览 1904

不知道微信小程序基于什么原因,一直不支持本地图片做背景。大概是想让小程序名副其实,不想让小程序变大。但是,image 标签却可以随意使用本地图片……


解决方法无法是:


1. 使用网络图片,这种方式是官方推荐的。


2. base64编码 这种方法都会是小程序变“大”,不太推荐这种方式。


还有一种最头铁的解决办法,就是使用 image 标签,采用 CSS 定位的方式,让 image 标签充当背景。


<view class="container">
  <image src='../image/2.jpg'></image>
  <view class='text'>
     为我设置背景图片
  </view>
</view>


.container{
  width: 100%;
  height: 600rpx;
  margin: 0;
  padding: 0;
  position: relative;
}
image{
  position: absolute;
  width: 100%;
  height: 600rpx;
}
.text{
  position: absolute;
  z-index: 1;
}


发表评论

暂无评论,抢个沙发...

客服 工单