微信小程序常见小问题（基础篇）持续更新中...

1.scroll-view视图组件横向滚动的实现

按照微信官方文档添加了scroll-x以及enable-flex之后还是不能实现横向滚动
1.给scroll-view组件添加scroll-x允许滚动以及样式：display: inline-block;
2.给需要滚动的view元素添加样式：white-space: nowrap;

wxml代码：

<scroll-view class="content1" scroll-x>
    <view>A</view>
    <view>B</view>
    <view>C</view>
</scroll-view>

wxss代码：

view{
    
    
    width: 200rpx;
    height: 200rpx;
    text-align: center;
    line-height: 200rpx;
    /* 解决横向滚动问题 */
    display: inline-block; /* 第一步 */
}
view:first-child{
    
    
    background-color: lightgreen;
}
view:nth-child(2){
    
    
    background-color: lightskyblue;
}
view:last-child{
    
    
    background-color: lightpink;
}
.content1{
    
    
    height: 200rpx;  
    width: 240rpx;
    border: 1px solid red;
    white-space: nowrap; /* 第二步 */
}

效果图：