小程序按钮如何设置背景图？

Question

各位老师好，在小程序中如何将下面的按钮背景填充成一张背景图呢？通过CSS添加background-image属性好像是无效的，请问应该如何正确设置呢？

白底状态

希望可以将红色区域填充为背景图

.wxml

<view class="px-2 home-t" style="height:120rpx;">
    <view class="home-con d-flex jc-between">
        <navigator class="view-between" url="/pages/exchange/exchange">
              <image mode="widthFix" src="/images/like-o.png"></image>
              <text>菜单入口1</text>
        </navigator>
        <navigator class="view-between" openType="switchTab" url="/pages/character/character">
              <image mode="widthFix" src="/images/like-o.png"></image>
              <text>菜单入口2</text>
        </navigator>
    </view> 
</view>

.wxss

.px-2 {
padding-left: 24rpx;
padding-right: 24rpx;
}

.home-t {
margin-top: 42rpx;
}

.jc-between {
justify-content: space-between;
}

.d-flex {
display: flex;
}

.home-con .view-between {
  display: flex;
  align-items: center;
  width: 340rpx;
  height: 110rpx;
  background: #ffffff;
  box-shadow: 1rpx 0rpx 10rpx rgba(0, 0, 0, 0.1);
  border-radius: 10rpx;
}

.home-con .view-between image {
  margin-left: 24rpx;
  max-width: 68rpx;
}

.home-con .view-between text {
  line-height: 137rpx;
  color: #333;
  font-weight: 700;
  font-size: 28rpx;
  margin-left: 24rpx;
}

Answer 1

无效是因为你用的是本地图片吧