如何为<div>？</div>设置滚动条的样式

Question

如何为<div>将滚动条设为黑色？

Webkit，IE7到IE9和Firefox有什么用吗？

Answer 1

你不能在Firefox中这样做。只有IE和webkit浏览器支持修改滚动条。

有关如何在MSIE中执行此操作，请参阅http://msdn.microsoft.com/en-us/library/ie/ms531153%28v=vs.85%29.aspx，有关如何在webkit中执行此操作，请参阅http://www.webkit.org/blog/363/styling-scrollbars/。

Answer 2

您无法设置浏览器滚动条的样式。它并没有普遍支持（尽管IE确实试图实现它）。

此外，从可访问性的角度来看，这是一个坏主意。想想（老）那些看不到你那个非常苗条，几乎看不见的自定义滚动条的人，或者不知道你那里有什么实际上是滚动条。

您可以在JS中使用自定义滚动条插件，例如this one。它到处都是

Answer 3

正如Pez Cuckow所说：

  

我认为自定义滚动条是用javascript实现的   非常光滑，你不能让浏览器滚动条看起来那么好！

     

找一个我刚刚为你准备的例子：   http://jsfiddle.net/9LHPW/2/ - 请注意检查资源标签   包括四个外部文件（3x Js和1x CSS）

     

看看这个网站的另一个例子（看起来完全正确   你想要的Javascript和jQuery：   http://manos.malihu.gr/tuts/jquery_custom_scrollbar.html

     

你可以找到插件的主页   http://manos.malihu.gr/jquery-custom-content-scroller

     

以及如何使用它的部分！

Answer 4

我同意你不应该篡改可滚动区域滚动条的可见性（我正在看你的Apple）。有时，带有可滚动文本的框只适合边界内部，并且没有视觉线索让用户知道它滚动从而使用户感到困惑。防止用户使用您的应用程序真的是个好主意吗？很可能不是，但你也可以争辩说你的目标人口不会有任何问题;极端内联竞争的申请可能不会被那些看不太清楚的人使用。然而，可访问性/可用性问题超出了视觉障碍;认知障碍，或非技术娴熟的个人可能非常善于说积极的内联，并希望参加你即将举行的活动，但不能，因为黑色黑色滚动条看起来很棒。

所有人都说，做什么让你开心。这就是我的工作。