先來一波官方教程https://developers.weixin.qq.com/miniprogram/dev/component/image.html

今天在小程序中用到image組件的時(shí)候，我直接使用是設(shè)置只圖片的寬，想讓圖片高度自適應(yīng)，結(jié)果發(fā)現(xiàn)系統(tǒng)對圖片有默認(rèn)的寬高

?

?然后我重置了圖片高度為height:auto;然而圖片直接看不到了，顯示圖片高度為0，就好像圖片只是一個(gè)背景圖片，不設(shè)置高就不會(huì)顯示；

此時(shí)，我想當(dāng)然的會(huì)重溫一下小程序圖片組件的教程，根據(jù)需要設(shè)置了image組件屬性mode='widthFix'，最終解決了我的問題

根據(jù)我的理解：由于小程序?qū)Ρ尘皥D片的支持有限制，因此大大放寬了image的功能，仿佛是兩者之間的結(jié)合，

　　　　當(dāng)image有確定的寬高值時(shí)，就會(huì)不保持縱橫比縮放圖片，使圖片的寬高完全拉伸至填滿 image 元素，相當(dāng)與mode='scaleToFill';

　　　　而mode的屬性值就類似于css中對background-size與background-position的設(shè)置

'

轉(zhuǎn)載于:https://www.cnblogs.com/joyer-lee/p/9399471.html

總結(jié)

以上是生活随笔為你收集整理的小程序图片显示问题的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。