微信小程序限制图片显示高度

微信小程序可以通过设置图片的样式来限制图片的显示高度。具体来说，可以使用 CSS 的 height 属性来设置图片的高度，例如：

.image {
  height: 200rpx;
}

这样就可以将图片的高度限制在 200rpx 以内。另外，还可以使用 max-height 属性来设置图片的最大高度，例如：

.image {
  max-height: 200rpx;
}

这样可以让图片的高度自适应，但是不会超过 200rpx。需要注意的是，rpx 是微信小程序中的一种长度单位，可以根据屏幕宽度进行自适应缩放，详细可以参考微信官方文档。

相关问题

微信小程序限制图片显示高度top模式

微信小程序中，可以通过设置图片的mode属性来控制图片的显示方式。其中，mode="top"可以使图片的高度固定，宽度自适应，并且将图片的顶部对齐父容器的顶部。

如果需要设置图片的最大高度，可以使用CSS样式的max-height属性。例如，可以在图片的父容器中设置max-height属性，来限制图片的最大高度。

示例代码如下：

<view style="max-height: 200rpx;">
  <image src="图片地址" mode="top" style="width: 100%;"></image>
</view>

上述代码中，通过设置父容器的max-height属性为200rpx，来限制图片的最大高度。同时，设置图片的mode属性为"top"，使其高度固定，宽度自适应，并且顶部对齐父容器的顶部。最后，设置图片的宽度为100%，使其自适应父容器的宽度。

微信小程序设置图片大小代码

你可以使用 `wx.getImageInfo()` 方法获取图片信息，然后根据需要设置图片大小。以下是一个示例代码：

wx.getImageInfo({
  src: 'your-image-source',
  success: function(res) {
    var width = res.width; // 获取图片真实宽度
    var height = res.height; // 获取图片真实高度
    var ratio = width / height; // 计算宽高比

    // 根据宽高比及最大宽度限制计算图片宽度
    var maxWidth = 300; // 最大宽度
    var imageWidth = maxWidth;
    var imageHeight = maxWidth / ratio;

    // 设置图片大小
    that.setData({
      imageWidth: imageWidth,
      imageHeight: imageHeight
    });
  }
});

在上面的示例代码中，我们使用了 `wx.getImageInfo()` 方法获取图片信息，并计算出了适合的大小。然后通过 `setData()` 方法将图片大小设置到页面中。注意，`that` 是指向当前页面对象的引用。你需要将其设置为正确的值。