Webkit滚动条CSS,一直是角落里的白盒子

Question

有没有办法避免出现在自定义样式webkit滚动条上的默认白框？

仅当水平和垂直溢出时才会出现白框.(使用谷歌浏览器)

编辑:我尝试将body背景设置为不同的颜色 - 仍然只看到一个白色的盒子.

截图:

CSS:

::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

::-webkit-scrollbar-track {
  background: transparent;
}

::-webkit-scrollbar-thumb {
  border-radius: 5px;
  background: rgba(0,0,0,0.35);
}
::-webkit-scrollbar-corner {
  background: #0c0c0c;
}

Answer 1

这有点过时,但在chrome中,您可以将背景颜色设置为rgba(0,0,0,0).任何带有alpha 0和框的东西都不会显示:)!

::-webkit-scrollbar-corner {
  background: rgba(0,0,0,0);
}

Answer 2

正如 ECPabon 提到的，您可以使用

 ::-webkit-scrollbar-corner {background-color: red;}

标签，将背景颜色设置为透明对我有用。

::-webkit-scrollbar-corner {background-color: transparent;}

Answer 3

如果您只需要垂直滚动条，您可以使用

溢出-y：滚动；

白色是 x 滚动条和 y 滚动条之间的空间

我希望它能解决你的问题

Answer 4

虽然 ECPabon 提供的答案在技术上是正确的，但真正的错误是 x64 Linux 上的 Chrome 50 在 GTK 集成方面存在错误。从 Chrome 51 开始，该问题已得到解决。