Css 重写UI5中的webkit滚动条

在控制台中，如果我看到，则会出现以下类：

html.sap-desktop ::-webkit-scrollbar {
    width: 16px;
    height: 16px;
    background-color: #f7f7f7;
}

html.sap-desktop ::-webkit-scrollbar-corner {
    background-color: #f7f7f7;
}

html.sap-desktop ::-webkit-scrollbar-thumb {
    background-color: #e6e6e6;
}

我想给滚动条加上蓝色并改变宽度。这就是我所做的。请告诉我这个主意是否好，如果不是，还有什么其他的方法可以使用

.sapUiBody .sapMPageEnableScrolling::-webkit-scrollbar {
    width: 6px;

}

.sapUiBody .sapMPageEnableScrolling::-webkit-scrollbar-track {
    background-color: #ffffff;
    border-radius: 5px;
 }

.sapUiBody .sapMPageEnableScrolling::-webkit-scrollbar-thumb {

    background-color: #005daa;
    height: 3px !important;

}

One more issue I am facing is, when I hover over my scrollbar, it becomes grey. 

---

在样式表中添加以下CSS并更新颜色

.sap-desktop ::-webkit-scrollbar {
    width: 16px !important;
}
.sap-desktop ::-webkit-scrollbar-thumb {
    background-color: #005483 !important;/* Update color */
}
.sap-desktop ::-webkit-scrollbar-thumb:hover { /* Scrollbar hover */
    background-color: #d14900 !important; /* Update hover color */
}

---

首先，直接修改css类不是一个好主意。这将改变你应用程序中的所有实例，比如scrollbar…给家长一个css类，然后修改css e、 g

---

如果您与他人分享屏幕截图，将会很有帮助。

.parentCssClass .sap-desktop ::-webkit-scrollbar {
    width: 16px !important;
}