uniapp中使用背景图片

uni-app 中使用背景图片
一 : H5 上使用(但是在微信小程序中报错)

background-image: url(../../static/images/bg.png);
background-size: 100% 100%;
background-position: 50% 50%;
background-repeat: no-repeat;


二 : 微信小程序中可以
1,使用网络图片(对不同环境需要不同配置)&＃xff0c;
2,或者 base64(需要本地转换)&＃xff0c;
3,或者使用标签(推荐使用)

<view class&＃61;"out"><image class&＃61;"image-bg" src&＃61;"/static/images/bg.png"/>// ... </view>
</view>


.out {position: relative;z-index: 0; // 支付宝小程序下背景不生效时&＃xff0c;可以加上这个
}.image-bg {position: absolute;z-index: -1;left: 0;right: 0;bottom: 0;right: 0;width: 100%;height: 100%;
}