view布局效果图:
.wxml
<view class="content">
<view class='t1'></view>
<view class='t2'></view>
<view class='t1'></view>
<view class='t2'></view>
<view class='t2'></view>
<view class='t1'></view>
<view class='t2'></view>
<view class='t2'></view>
<view class='t2'></view>
<view class='t1'></view>
<view class='t2'></view>
<view class='t1'></view>
</view>
<view class="content">
<view class='t2'></view>
<view class='t2'></view>
<view class='t2'></view>
<view class='t2'></view>
<view class='t2'></view>
<view class='t2'></view>
<view class='t2'></view>
<view class='t2'></view>
<view class='t1'></view>
<view class='t1'></view>
<view class='t1'></view>
<view class='t1'></view>
</view>
.wcss
.content {
display: flex;
flex-direction: row;
margin-top: 20rpx;
margin-left: 70rpx;
}
.t1{
height: 20px;
width: 20px;
background-color: red;
margin-left: 10rpx;
}
.t2{
height: 20px;
width: 20px;
background-color: grey;
margin-left: 10rpx;
}