uni.app圖片同比例縮放
圖片同比例縮放是經常用到的,剛開始設置了什么max-width、object-fit都不行,最后才知道uni.app里自帶的mode屬性可以解決這個問題,真是方便了很多。
aspectFill:保持縱橫比縮放圖片,只保證圖片的短邊能完全顯示出來。也就是說,圖片通常只在水平或垂直方向是完整的,另一個方向將會發生截取
aspectFit:保持縱橫比縮放圖片,使圖片的長邊能完全顯示出來。也就是說,可以完整地將圖片顯示出來。
widthFix:寬度不變,高度自動變化,保持原圖寬高比不變
<view class="orgimg"> <image src="../../../static/timg%5B3%5D.jpg" mode="aspectFill" ></image> </view> //css部分 <style lang="scss"> .orgimg { width: 500upx; height: 500upx; } </style>``` 