您當前位置>首頁 » 新聞資(zī)訊 » 小程序相關(guān) >
微信小程序圖片布滿整個(gè)窗口
發表時間:2020-10-19
發布人:葵宇科技
浏覽次數:52
微信小程序圖片布滿整個(gè)窗口
在做微信小程序或者微信公衆号前端時候,經常遇到一張圖片當做背景,布局整個(gè)窗口,有時圖片不能占滿窗口
<view class="imagediv">
<image src="/static/image/start.png" mode="widthFix" class="imagetp"/>
</view>
設置樣式
.imagediv{
position: absolute;
width: 100%;
height: 100%;
}
.imagetp{
width: 100%;
height: 100%;
}
以上代碼,不能有效讓圖片占滿窗口,因為image标簽會默認設置
display:inline-block;,對應的圖片高度會有一個(gè)值height:66rpx;
此時,需要在本頁面中(zhōng)圖片樣式中(zhōng)新增display:initial;
.imagetp{
width: 100%;
height: 100%;
display: initial;
}