wx代码
<view class=“section section_gap”>
<view class=“section__title”>horizontal scroll</view>
<scroll-view class=“scroll-view_H” scroll-x style=“width: 100%”>
<view id=“green” class=“scroll-view-item_H bc_green”></view>
<view id=“red” class=“scroll-view-item_H bc_red”></view>
<view id=“yellow” class=“scroll-view-item_H bc_yellow”></view>
<view id=“blue” class=“scroll-view-item_H bc_blue”></view>
</scroll-view>
</view>
css代码
.section_gap{
}
.scroll-view_H{
display: block;
width: 100%;
flex-wrap: nowrap;
}
.scroll-view-item_H{
width: 200px;
height: 100px;
flex-wrap: nowrap;
}
.bc_green{
background: green;
}
.bc_red{
background: red;
}
.bc_yellow{
background: yellow;
}
.bc_blue{
background: blue;
}
效果