小程序
小游戏
企业微信
微信支付
扫描小程序码分享
如何在保持图片高度不变的情况下,让宽度自适应缩放,注意:高度需要固定不变,请教各位大神
8 个回答
加粗
标红
插入代码
插入链接
插入图片
上传视频
图片高度固定,宽度根据图片宽高比撑开,设置如下:设置固定height,mode: heightFix,不设置width, 即可。
你好,麻烦通过点击下方“反馈信息”按钮,提供出现问题的。
直接设置高度的值就可以了 宽度auto
或者image组件有mode属性
<view id="iimgg">
<image mode="aspectFit" src="{{shopGood.listPicUrl}}" bindtap="toDetail"></image>
</view>
#iimgg{
display:flex;
justify-content: center;
}
.goods-list image {
height: 340rpx;
确实,只有设置成背景图片可以解决
width: 100%; background-size: auto 100%; background-repeat: no-repeat;
你可以把 有颜色部分当成 背景底色, 文字部分 独立出来就可以了。
<view class="image">红方一注</view>
注:底图部分记得去掉文字内容
bindload 获取图片的宽高,然后比例自己算
宽度%,高度px
关注后,可在微信内接收相应的重要提醒。
请使用微信扫描二维码关注 “微信开放社区” 公众号
图片高度固定,宽度根据图片宽高比撑开,设置如下:设置固定height,mode: heightFix,不设置width, 即可。
直接设置高度的值就可以了 宽度auto
或者image组件有mode属性
<view id="iimgg">
<image mode="aspectFit" src="{{shopGood.listPicUrl}}" bindtap="toDetail"></image>
</view>
#iimgg{
display:flex;
justify-content: center;
}
.goods-list image {
height: 340rpx;
}
确实,只有设置成背景图片可以解决
width: 100%; background-size: auto 100%; background-repeat: no-repeat;
你可以把 有颜色部分当成 背景底色, 文字部分 独立出来就可以了。
<view class="image">红方一注</view>
注:底图部分记得去掉文字内容
bindload 获取图片的宽高,然后比例自己算
宽度%,高度px