微信小程序圖片寬100%顯示并且不變形
更新時間：2017年06月21日 11:21:20 投稿：lqh
這篇文章主要介紹了微信小程序圖片寬100%顯示并且不變形的相關資料,需要的朋友可以參考下
微信小程序圖片寬100%顯示并且不變形
按照HTML習慣進行寫，代碼：
<view class="meiti"> <image src="http://10.0.0.171:9001/images/2017/0619/20170619115150713_progressive.jpg" style="width:100%;"></image> </view>
效果如下：
很明顯變形了
找到一篇關于微信小程序 圖片的信息
http://www.dbjr.com.cn/article/116771.htm
在圖片上加上 mode=”widthFix”
代碼如下：
<view class="meiti" style="background-color:red;">
<image src="http://10.0.0.171:9001/images/2017/0619/20170619110943813_progressive.jpg"
mode="widthFix"
style="width:100%;background-color:black;" ></image>
</view>
效果：
這樣就能達到我們的要求了，等比例縮放。
感謝閱讀，希望能幫助到大家，謝謝大家對本站的支持！
相關文章
這篇文章主要介紹了微信小程序 用戶數(shù)據(jù)解密詳細介紹的相關資料,需要的朋友可以參考下2017-01-01
這篇文章主要介紹了微信小程序switch組件詳細介紹的相關資料,需要的朋友可以參考下2016-09-09
這篇文章主要介紹了微信小程序 canvas API詳解及實例代碼的相關資料,需要的朋友可以參考下2016-10-10
這篇文章主要為大家介紹了前端算法leetcode109題解有序鏈表轉換二叉搜索樹示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2022-09-09
fabric.js圖層功能獨立顯隱?添加?刪除?預覽實現(xiàn)詳解
這篇文章主要為大家介紹了fabric.js圖層功能獨立顯隱?添加?刪除?預覽實現(xiàn)詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2023-05-05
理解js中原型、原型鏈這個概念，絕對是幫助我們更深入學習js的必要一步，比如，如果js開發(fā)者想理解js繼承，new關鍵字原理，甚至封裝組件、優(yōu)化代碼，弄明白js中原型、原型鏈更是前提條件。本篇文章，用最簡潔的文字，清楚明白講解原型鏈相等關系和原型、原型鏈存在的意義2021-09-09
這篇文章主要介紹了微信小程序 新建登錄頁并實現(xiàn)tabBar隱藏的相關資料,需要的朋友可以參考下2017-06-06
微信小程序之數(shù)據(jù)雙向綁定與數(shù)據(jù)操作
這篇文章主要介紹了微信小程序之數(shù)據(jù)雙向綁定與數(shù)據(jù)操作的相關資料,需要的朋友可以參考下2017-05-05
微信小程序 數(shù)組中的push與concat的區(qū)別
這篇文章主要介紹了微信小程序 數(shù)組中的push與concat的區(qū)別的相關資料,需要的朋友可以參考下2017-01-01
這篇文章主要介紹了微信小程序 檢查接口狀態(tài)實例詳解的相關資料,需要的朋友可以參考下2017-06-06