【微信小程序】图片下方空白区域
-
问题来源
连续展示多张图片时发现每张图片下方都留有空白区域，如下图。
当前环境wxml代码：
<block wx:for="{{products}}">
<image src="{{item}}" style='width:100%;' />
</block>
- 解决办法
1、方法一：设置vertical-align: middle;适用于对图片宽高显示没有要求的情况
image {
vertical-align: middle;
}
2、方法二：限制图片的大小，适用于图片宽高有规定大小的情况
image {
height:200rpx;
}
本篇博客旨在记录了自己在小程序编程过程中碰到的一部分问题，如有错误的地方欢迎指正