uni-app scroll-view隐藏滚动条的小细节 兼容主流浏览器

开端

想写个横向滚动的列表适配浏览器，主要就是隐藏一下滚动条在手机上美观一点。

但是使用uni-app官方文档建议的::-webkit-scrollbar在目标标签时发现没生效。

.scroll-view_H::-webkit-scrollbar{
  display: none;
}

解决

F12看了一下，原来编译到浏览器端时scroll-view下自动套了几层div，::-webkit-scrollbar生效了，只是生效的地方错了,

解决很简单，目标标签加上空格div就行了，顺便::-webkit-scrollbar也并非标准写法，要想在firefox和IE生效可参考如下写法

.scroll-view_H div::-webkit-scrollbar{
  display: none; /* Chrome Safari */
}
.scroll-view_H div{
  -ms-overflow-style: none; /* IE 10+ */
  scrollbar-width: none; /* Firefox */
}