小程序图片显示问题

最近做项目的时候遇到了一个问题，记录一下。

**问题点：**同事用安卓手机测试小程序，发现背景图显示不出来，但是苹果手机的背景图是能够显示出来的。
**解决方案：**将背景图改成普通图片，通过定位来固定他。

方法一（目前我的解决方案）：
wxml

<view>
	<image class="imgs" src="../../images/bg.png"></image>
    <view class="contents">其他内容</view>
</view>

wxss

.imgs{
  width:100%;
  height: 300rpx;
  position: absolute;
  top: 0;
  z-index: 1;
}
.contents{
  position: relative;
  z-index: 2; //其他的内容想要浮在图上，必须要设置z-index，不然显示不出来
}

方法二（之前的方案，虽然同事的安卓手机显示不出来）：

wxml

//背景图必须写在页面上，不然没效果
<view class="about-header" style="background:url(../../images/bg.png);background-repeat: no-repeat;background-size: 100%;">
	<view>其他内容</view>
<view>

最终显示样式：