aap仿微信发朋友圈及朋友圈九宫格

html

<view class="w">
  <view class="bg" v-for="(item,index) in img">
    <image :src="item.src" mode="aspectFill"></image>
  </view>
</view>

 

scss

.w {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    width: 100%;
  .bg {
    flex: 0 0 auto;
    width: calc( ( 100% - 60rpx ) / 3 );
    padding: 10rpx;
    padding-top: 2rpx;
    image {
    width: 100%;
    height: 210rpx;
    }
  }

}

 

实现效果

 

posted on 2020-12-22 14:29  未信l  阅读(109)  评论(0)    收藏  举报

导航