移动端Chrome滚动条无法隐藏：已用-webkit-scrollbar仍无效的技术求助

先给你几个关键点和修复方案：

1. 先修复语法错误
   你之前写的媒体查询代码没闭合，少了两个}，这直接导致整个样式块不生效，正确的写法应该是：

@media screen and (max-width:768px) {
  ::-webkit-scrollbar {
    display: none;
  }
}

2. 针对滚动容器精确设置样式
   有时候全局的::-webkit-scrollbar在移动端模拟里优先级不够，或者没作用到实际滚动的元素上。如果是页面整体滚动，就给body或html加上选择器：

@media screen and (max-width:768px) {
  body::-webkit-scrollbar,
  html::-webkit-scrollbar {
    display: none;
  }
}

如果是某个自定义滚动容器（比如带overflow: auto的div），就替换成容器的类名/ID：

@media screen and (max-width:768px) {
  .custom-scroll-box::-webkit-scrollbar {
    display: none;
  }
}

3. 添加多浏览器兼容属性
   除了webkit的写法，加上其他浏览器的隐藏滚动条样式，确保覆盖所有场景：

/* 全局基础样式 */
::-webkit-scrollbar {
  display: none;
}
/* 火狐 */
html {
  scrollbar-width: none;
}
/* IE/Edge */
body {
  -ms-overflow-style: none;
}

/* 移动端媒体查询补充 */
@media screen and (max-width:768px) {
  body::-webkit-scrollbar,
  html::-webkit-scrollbar {
    display: none;
  }
}

4. 注意开发者工具的模拟特性
   Chrome开发者工具的移动端模拟有时候会显示"模拟的滚动条"，实际真机上可能不会出现。你可以在真实手机上测试下，如果真机没问题，那可能只是工具的显示效果。

内容的提问来源于stack exchange，提问作者Junki