实现如图，只需html与scss
文章来源地址https://www.toymoban.com/news/detail-600964.html
html部分
<view class="photo">
<view class="items">
<image src="/static/images/association/fc1.png" mode='widthFix' bindtap="viewImage"></image>
</view>
<view class="items">
<image src="/static/images/association/fc2.png" mode='widthFix' bindtap="viewImage"></image>
</view>
<view class="items">
<image src="/static/images/association/fc3.png" mode='widthFix' bindtap="viewImage"></image>
</view>
<view class="items">
<image src="/static/images/association/fc4.png" mode='widthFix' bindtap="viewImage"></image>
</view>
<view class="items">
<image src="/static/images/association/fc5.png" mode='widthFix' bindtap="viewImage"></image>
</view>
<view class="items">
<image src="/static/images/association/fc6.png" mode='widthFix' bindtap="viewImage"></image>
</view>
</view>scss部分
.photo{
margin-top: 12rpx;
column-gap: 0;
column-count: 2;
// padding: 10rpx 10rpx 10rpx 15rpx;
.items{
width: 100%;
break-inside: avoid;
image{
width: 100%;
border-radius: 5rpx;
}
}
}文章来源：https://www.toymoban.com/news/detail-600964.html
到了这里，关于两行两列瀑布流图片排列布局（uniapp、小程序）的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
