【微信小程序】图片下方空白区域

• 问题来源
  连续展示多张图片时发现每张图片下方都留有空白区域，如下图。
  
  当前环境wxml代码：

<block wx:for="{{products}}">
  <image  src="{{item}}" style='width:100%;'  />
</block>

• 解决办法

1、方法一：设置vertical-align: middle;适用于对图片宽高显示没有要求的情况

image {
  vertical-align: middle;
}

2、方法二：限制图片的大小，适用于图片宽高有规定大小的情况

image {
  height:200rpx;
}

本篇博客旨在记录了自己在小程序编程过程中碰到的一部分问题，如有错误的地方欢迎指正