微信小程序图片宽高自适应_微信小程序图片高度自适应

作者：盐析白兔 | 2024-08-09 15:56:13

踩

微信小程序图片高度自适应

微信小程序<image>有默认的宽高width:320rpx;height:240rpx;只设置width：100%是无效的，即使写了height：100%，依然无效

只要在<image>标签添加mode="widthFix"属性，就可以做到高度自适应，


wxml
<view  class="detail-x">
	<text>图文详情</text>
	<image src="/images/detail.png" mode="widthFix"></image>
</view>
 
wxss
.detail-x > image {
  width: 694rpx;
}

以下为效果图，宽度同理，设置高度后，将mode="heightFix"即可

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/盐析白兔/article/detail/954050