收藏
回答

页面刚加载图片大小不是wxss设置的大小

问题模块
API和组件

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

最后一次编辑于  2017-11-15  (未经腾讯允许,不得转载)
回答关注问题邀请回答
收藏

4 个回答

  • 黄思程
    黄思程
    2017-11-15

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

    2017-11-15
    赞同
    回复
  • 黄思程
    黄思程
    2017-11-15

    还有截图

    2017-11-15
    赞同
    回复
  • 黄思程
    黄思程
    2017-11-15

    请提供下代码

    2017-11-15
    赞同
    回复
  • 指尖流逝你
    指尖流逝你
    2017-11-15

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

    现在是这个问题,给内联样式,使用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

    },

    ]





    2017-11-15
    赞同
    回复