### [微信小程序怎样加背景图片](https://www.prosaas.cn/article/16841)

**Published:** 2020-03-23T03:29:21

**Author:** 5201314

**Excerpt:** 经常为微信小程序设置颜色背景，突然发现一张好看的图片怎么把它设置为背景呢?微信小程序怎样加背景图片 以下总结了…

经常为微信小程序设置颜色背景，突然发现一张好看的图片怎么把它设置为背景呢?

![](https://img.php.cn/upload/article/000/000/040/5e782af8863c6156.jpg)

**微信小程序怎样加背景图片**    

以下总结了三种方法：

**1、wx****ss中通过background-image设置网络图片来添加背景图片****；**

微信小程序中background-image不能使用本地图片

推荐学习：小程序开发

background-image:url(https://xxxxxxxxxxxxxxxxxxxxxx)

**2、将图片转为Base64编码格式，然后使用background-image来添加背景图片；**

background-image:url(转换之后的base64字符串)

**3、利用流布局，设置z-index层级，将image标签置于底层来添加背景图片。**

//html
<view class="container">
  <image src='../image/1.jpg'></image>
  <view class='up'>
    我是一串字符串
  </view>
</view>
//css
.container{
  width: 100%;
  height: 600rpx;
  margin: 0;
  padding: 0;
  position: relative;
}
image{
  position: absolute;
  width: 100%;
  height: 600rpx;
}
.up{
  position: absolute;
  z-index: 1;
}

PHP中文网，大量网站建设教程，欢迎学习！

以上就是微信小程序怎样加背景图片的详细内容，更多请关注知企PROSAAS其它相关文章！

**Tags:** background, php, 微信小程序

**Categories:** 后端开发

---