【小程序/Css】通过Flex实现双列商品展示自动换行效果

 wxml代码

<!-- ====== 商品区 ====== -->

<view class="shopBox">

    <view class="proc" wx:for="{{8}}">
        商品1
    </view>
</view>

wcss代码

.shopBox {
    height: 500px;
    width: 96%;
    background-color: rgb(203, 237, 250);
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
}

.proc {
    height: 200px;
    width: 48%;
    background-color: #fad2d2;
    margin-left: 5px;
    margin-bottom: 5px;
    text-align: center;
    line-height: 200px;
}