css设置滚动条样式在IOS上无效

Question

给滚动条设置了样式，在安卓机上显示正常，但是ios无法正常显示，仍然显示的是原生的滚动条。
代码如下

/* 外层包裹盒子 */
.db_box {
  height: 25vw;
  display: flex;
  overflow: hidden;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.db_box::-webkit-scrollbar {
  background-color: #ffffff;
  height: 3px;
}
.db_box::-webkit-scrollbar-track {
  background-color: #bcbcbc4a;
  margin: 0 40vw;
  border-radius: 15px;
}
.db_box::-webkit-scrollbar-thumb{
  background-color: #bcbcbc;
  border-radius: 15px;
}

也写过如下的尝试，但是仍然无效

/* 外层包裹盒子 */
.db_box {
  height: 25vw;
  display: flex;
  overflow: hidden;
  overflow-x: auto;
  -webkit-overflow-scrolling: auto;
}
.db_box::-webkit-scrollbar {
  background-color: #ffffff;
  height: 3px;
  border: 4px solid transparent;
  background-clip: content-box;
}
.db_box::-webkit-scrollbar-track {
  background-color: #bcbcbc4a;
  margin: 0 40vw;
  border-radius: 15px;
}
.db_box::-webkit-scrollbar-thumb{
  background-color: #bcbcbc;
  border-radius: 15px;
}

已经是我在网络上能找到的全部的解决方案了，全部是无效的，想请问有什么解决办法吗

Answer 1

支持的不一样，你可以试试自己写一个滚动条，这样就不会出现不兼容的问题了