問題? :微信小程序通過css:background-image引入背景圖片失敗
[渲染層網(wǎng)絡(luò)層錯(cuò)誤] pages/wode/wode.wxss 中的本地資源圖片無法通過 WXSS 獲取，可以使用網(wǎng)絡(luò)圖片，或者 base64，或者使用<image/>標(biāo)簽
解決方法微信小程序在使用background-image設(shè)置背景圖時(shí)報(bào)錯(cuò)：渲染層網(wǎng)絡(luò)層錯(cuò)誤_index.wxss 中的本地資源圖片無法通過 wxss 獲取-CSDN博客
背景圖片相關(guān)應(yīng)用-鋪滿，自適應(yīng)_backgroundimage鋪滿-CSDN博客
// html代碼
<view class="test" style="background-image: url('/images/myInfoBg.png')">
</view>
// css 代碼
.test{
background-size: contain;
}
上述方法之后，真機(jī)運(yùn)行仍然顯示不出圖片可以使用以下方法
微信小程序背景圖片真機(jī)不顯示問題 - 代碼先鋒網(wǎng)
1.圖片轉(zhuǎn)basd64? （常用方法）
Background_base64: function (path) {
return 'data:image/jpg;base64,' + wx.getFileSystemManager().readFileSync(path, 'base64');
},
let img_path = Background_base64('../pages/images/adventure_bac.jpg');
this.setData({
img_path: img_path
})
wxml
<view style="background-image: url({{img_path}});"></view>2.使用<image />文章來源：http://www.zghlxwxcb.cn/news/detail-761026.html
<view style="">
<image style="position: absolute;width: 100%;height: 100%;" src=""></image>
</view>3.將圖片放在服務(wù)器上，并使用http訪問文章來源地址http://www.zghlxwxcb.cn/news/detail-761026.html
到了這里，關(guān)于微信小程序背景圖片設(shè)置的文章就介紹完了。如果您還想了解更多內(nèi)容，請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！
