页面刚加载图片大小不是wxss设置的大小
发布于 5 年前 作者 wei57 19795 次浏览 来自 问答

小程序wxss设置图片的宽高**rpx,但是保存后页面加载出来是另一个尺寸,在控制台修改一下宽高的数据才能正常显示,咋回事

4 回复

还有截图

请提供下代码

你好,这是一个已知问题,我们会尽快进行修复。

图片那个问题刚看了下自己好了。

现在是这个问题,给内联样式,使用rpx可以实现自适应,但是在样式表里面写实现不了。

<block wx:for="{{listItem}}">

<view class=‘list-item’ style=‘width:340rpx;’>

<image src=’{{item.imgUrls}}’  mode=‘aspectFit’  style=‘width:340rpx;height:340rpx;’ ></image>

<view class=‘item-info’>

<view class=‘info-proname’>

<text class=‘info-ziying’ wx:if="{{item.show}}">自营</text>

{{item.proname}}</view>

<view class=‘info-info’>

<text class=‘info-type’>{{item.infotype}}</text>

<text class=‘info-price’>¥{{item.infoprice}}</text>

</view>

</view>

</view>

</block>

wxss:

#list .list-item{

width: 340rpx;

height: 468rpx;

background: #fff;

display: flex;

flex-direction: column;

justify-content: space-between;

margin-right: 20rpx;

margin-bottom: 20rpx;

}

.list-item image{

width: 340rpx;

height: 340rpx;

}

.item-info{

display: flex;

flex-direction: column;

justify-content: space-between;

padding: 28rpx 24rpx 28rpx 20rpx;

box-sizing: border-box;

}

.info-info{

display: flex;

justify-content: space-between;

margin-top: 20rpx;

}

.info-proname{

font-size: 28rpx;

color: #333333;

line-height: 28rpx;

}

.info-type{

font-size: 24rpx;

color: #999999;

line-height: 24rpx;

}

.info-price{

font-size: 28rpx;

color: #ED5B5B;

line-height: 28rpx;

}

.info-ziying{

width: 52rpx;

height: 28rpx;

border: 2rpx solid #19C0A3;

font-size: 24rpx;

color: #19C0A3;

line-height: 24rpx;

display: inline-flex;

justify-content: center;

align-items: center;

}

js:

listItem:[

{

“imgUrls”:"…/…/images/ysp/36.png",

“proname”:“小鱼(帆布包)”,

“infotype”:“林夕/单肩包”,

“infoprice”:“99”,

“show”:false

},

{

“imgUrls”: “…/…/images/ysp/37.png”,

“proname”: “秋水系列(组合包)”,

“infotype”: “曹夕/组合”,

“infoprice”: “230”,

“show”: true

},

{

“imgUrls”: “…/…/images/ysp/38.png”,

“proname”: “高山流水(桌摆)”,

“infotype”: “康熙/桌摆”,

“infoprice”: “2000”,

“show”: true

},

{

“imgUrls”: “…/…/images/ysp/39.png”,

“proname”: “水彩依稀(水杯)”,

“infotype”: “赵夕/水杯”,

“infoprice”: “78”,

“show”: false

},

{

“imgUrls”: “…/…/images/ysp/36.png”,

“proname”: “小鱼(帆布包)”,

“infotype”: “林夕/单肩包”,

“infoprice”: “99”,

“show”: false

},

{

“imgUrls”: “…/…/images/ysp/37.png”,

“proname”: “秋水系列(组合包)”,

“infotype”: “曹夕/组合”,

“infoprice”: “230”,

“show”: true

},

]

回到顶部