如何始终以有角度的材质显示滚动条?

Ric*_*ich 7 html css scrollbar angular-material angular

因此,目前,我正在使用角度材质及其默认滚动(但我认为这是完美的滚动条),可以用作滚动条的滚动设计。但是,仅在用户尝试滚动页面/ div时才显示滚动。我试图阅读Angular Material的滚动api,但是这里没有可以使用的属性。我overflow-y: scroll当然已经把它放在css上了。任何的想法?谢谢!

Ric*_*ich 6

所以我找到了解决方法,我需要将此包含到我的CSS中

::-webkit-scrollbar {
  -webkit-appearance: none;
  width: 7px;
}
::-webkit-scrollbar-thumb {
  border-radius: 4px;
  background-color: rgba(0, 0, 0, .5);
  -webkit-box-shadow: 0 0 1px rgba(255, 255, 255, .5);
}
Run Code Online (Sandbox Code Playgroud)

并且如果您需要特定的元素或容器

.selectionTable::-webkit-scrollbar {
    -webkit-appearance: none;
    width: 7px;
}

.selectionTable::-webkit-scrollbar-thumb {
    border-radius: 4px;
    background-color: rgba(0, 0, 0, .5);
    -webkit-box-shadow: 0 0 1px rgba(255, 255, 255, .5);
}
Run Code Online (Sandbox Code Playgroud)

参考:

使主滚动条始终可见

将Webkit滚动条样式应用于指定元素