自定义滚动条不适用于 Firefox答案

【问题标题】：Customized Scrollbar doesn't work for Firefox自定义滚动条不适用于 Firefox
【发布时间】：2012-09-13 20:30:17
【问题描述】：

我创建了一个网站。我自定义了主垂直滚动条。

它在 Google Chrome 和 Safari 上运行良好，但在 Mozilla Firefox 上却不行。

你有什么办法解决这个问题吗？

CSS 代码

::-webkit-scrollbar {                                   
    width: 10px;
    height: 6px;
    background: #FFF url(images/bg-blog-repeat.png) 0 0 repeat;
}


::-webkit-scrollbar-thumb {                             
    border: solid 0 transparent;
    border-right-width: 4px;
    -webkit-border-radius: 5px;
    -webkit-border-top-right-radius: 9px 5px;
    -webkit-border-bottom-right-radius: 9px 5px;
    -webkit-box-shadow: inset 0 0 0 1px rgb(79,79,79), inset 0 0 0 6px rgb(102,102,102);
}
::-webkit-scrollbar-thumb:hover {                       
    -webkit-box-shadow: inset 0 0 0 1px rgb(90,90,90), inset 0 0 0 6px rgb(110,110,110);
}
::-webkit-scrollbar-thumb:horizontal {                  
    border-right-width: 0;
    border-bottom-width: 2px;
    -webkit-border-top-right-radius: 5px;
    -webkit-border-bottom-right-radius: 5px 9px;
    -webkit-border-bottom-left-radius: 5px 9px;
}
::-webkit-scrollbar-corner {                            
    background: #FFF url(images/bg-blog-repeat.png) 0 0 no-repeat;
}

body ::-webkit-scrollbar {
    background: transparent none;
}

谢谢。

【问题讨论】：

首先它可以在 Chrome 和 Safari 中工作，因为您明确为 webkit 设置样式，而 Chrome/Safari 使用 webkit 浏览器引擎。 Firefox 是 mozilla。
参考-stackoverflow.com/questions/6165472/…

标签： css firefox webkit scrollbar customization

【解决方案1】：

对于以 -webkit- 开头的每一行，写另一个完全一样的，将 -webkit- 替换为 -moz-

【讨论】：