源码给你自己改 2021-12-27 16:48 采纳率: 33.3%
浏览 955
已结题

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

给滚动条设置了样式,在安卓机上显示正常,但是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;
}

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

  • 写回答

2条回答 默认 最新

  • ✎﹏ℳ๓敬坤 2021-12-27 16:56
    关注

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

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
  • 仰望星空的代码 博客专家认证 2021-12-28 09:01
    关注

    如果是app内嵌的H5,那么iOS中用的应该是UIwebview或wkwebview,查一下这两个webview内核对css滚动的兼容

    评论
查看更多回答(1条)

报告相同问题?

问题事件

  • 系统已结题 1月5日
  • 已采纳回答 12月28日
  • 创建了问题 12月27日

悬赏问题

  • ¥15 div editable中的光标问题
  • ¥15 mysql报错1415Not allowed to return a result set from a trigger 不知如何修改
  • ¥60 Python输出Excel数据整理,算法较为复杂
  • ¥15 看一下这个,可以商量
  • ¥15 回答几个问题 关于数据库
  • ¥15 51单片机串口通信问题,未完成且要修改
  • ¥15 百鸡问题 c++编程问题(相关搜索:输出数据)
  • ¥30 如何在CMD中设置代理
  • ¥15 我有一块薛定谔的硬盘
  • ¥15 微信小游戏开发2D碰撞检测问题