微信小程序scroll-view 横向滚动 显示下拉条的问题

微信小程序开发中，scroll-view的横向滚动，是一个常见的排列布局的方式，其实现的代码如下：

wxml部分：

 <scroll-view class="scroll-view_H" scroll-x="true" style="width: 100%">
  <view id="demo" class="scroll-view-item_H demo-text-1">1</view>
    <view id="demo"  class="scroll-view-item_H demo-text-2">2</view>
    <view id="demo" class="scroll-view-item_H demo-text-3">3</view>
    <view id="demo" class="scroll-view-item_H demo-text-3">4</view>
    <view id="demo" class="scroll-view-item_H demo-text-3">5</view>
  </scroll-view>

wxss部分：

.scroll-view_H{
  white-space: nowrap;
}
.scroll-view-item{
  height: 300rpx;
}
.scroll-view-item_H{
  display: inline-block;
  width: 36%;
  height: 300rpx;
  background-color: pink;
  margin-right: 20rpx;
}

其实现效果图：

 但是在苹果机型左右滑动总出现下拉条，很影响美观，这个时候在css部分增加一行代码就能解决这样的问题：

::-webkit-scrollbar {
  width: 0;
  height: 0;
  color: transparent;
}