微信小程序scroll-view 左右滑动效果

页面：

<view class="scroll_box"> 
                <scroll-view scroll-x>
            
                  <view class="item_list" >
                    1
                  </view>
                  <view class="item_list" >
                    2
                  </view>
                  <view class="item_list" >
                    3
                  </view>
                  <view class="item_list" >
                    4
                  </view>
                  <view class="item_list" >
                    5
                  </view>
                  <view class="item_list" >
                    6
                  </view>
                
                </scroll-view>
     </view>

　　样式

.scroll_box{
       100%;
      height: 307rpx;
      overflow: hidden;
      padding: 20rpx;
      background: #fff;
      white-space: nowrap;
      border: 1px solid red;
    }
    .scroll_box scroll-view{
      height: 100%;
       auto;
      overflow:hidden;
    }
    .item_list{
       160rpx;
      height: 100%;
      margin-right: 23rpx;
      display: inline-block;
      margin-left: 10px;
      background-color: blue;
    }