我们的背景图覆盖了文字，我们想要达到文字下面有背景图的效果。 wxml代码如下 <!--pages/register/register.wxml--> <view class="background"> <image src="图片链接" mode="widthFix"></image> </view>; <view class="container" wx:if="{{item.img}}">   <text class="header">账号登录</text>   <view class="interact">     <view class = "Head"><text class="nameInputText">账号</text></view>       <input placeholder="账号" bindinput="nameInput"/>     <text class="pwdInputText">密码</text>       <input placeholder="密码" bindinput="pwdInput"/>     <button class="button" bindtap="click">登录</button> </view> </view> wxss代码如下： /* pages/register/register.wxss */ page{   height:100%;   }   .background image{     width: 90%;     display: relative;   } input{   width: 100%;   height: 20px;     margin: 2%;     padding: 2%;     margin-bottom: 5%; } .Head {   margin-top: 10px; } .header {   display: block;   padding: 10px;   background-color: #a6c1ee;   font-size: 38px;   margin-top: 10px;   line-height: 10px; } .container {   margin-top: -100px;   position:relative;     z-index: 2;   margin: 200px 50px 100px 50px;   height: 400px;   border: 3px solid #faca82;   border-radius: 10rpx; } /*.nameInputText {   position: relative;   background: white;   margin: -10px 0 0 10px;   padding: 0 5px;   color: rgb(144, 147, 167); }*/ .button{   text-align: center;   padding: 10px;   width: 80%;   margin-top: 20px;   background-image: linear-gradient(to right, #a6c1ee, #fbc2eb); }