先看效果
代码:
<view class="sort-list">
<view class="list mt20 sel-list" wx:for="{{[1,1,1,1,1,1]}}"
wx:key="index">太阳石#01</view>
</view>
.sort-list {
display: flex;
display: -webkit-flex;
justify-content: space-between;
flex-direction: row;
flex-wrap: wrap;
.list {
width: 158rpx;
height: 66rpx;
line-height: 66rpx;
text-align: center;
background: #F1F1F1;
border-radius: 6rpx;
font-size: 24rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #333333;
}
/* 如果最后一行是3个元素 */
.list:last-child:nth-child(4n - 1) {
margin-right: calc(24% + 4% / 3);
}
/* 如果最后一行是2个元素 */
.list:last-child:nth-child(4n - 2) {
margin-right: calc(48% + 8% / 3);
}
}