小程序wxss设置图片的宽高**rpx,但是保存后页面加载出来是另一个尺寸,在控制台修改一下宽高的数据才能正常显示,咋回事
图片那个问题刚看了下自己好了。
现在是这个问题,给内联样式,使用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
},
]