[英]How to make scrollbar always visible in angular material?
So currently, I'm using angular material and its default scroll (But I think it is perfect scrollbar) to use as a scroll design to my scroll bar.所以目前,我正在使用有角度的材料和它的默认滚动条(但我认为它是完美的滚动条)作为滚动条的滚动设计。 But the scroll is only showing if the users try to scroll the page/div.
但是滚动仅在用户尝试滚动页面/div 时显示。 I tried to read the scrolling api of the Angular Material but there's no attribute that I can use in here.
我试图阅读 Angular Material 的滚动 API,但这里没有我可以使用的属性。 And I do already put the
overflow-y: scroll
on the css of course.当然,我已经将
overflow-y: scroll
放在了 css 上。 Any idea?任何的想法? Thanks!
谢谢!
So I found a work around, I need to include pseudo
class to my CSS所以我找到了一个解决方法,我需要在我的 CSS 中包含
pseudo
类
::-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);
}
And if you need it to a specific element or container如果你需要它到一个特定的元素或容器
.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);
}
Reference:参考:
Making the main scrollbar always visible使主滚动条始终可见
Apply webkit scrollbar style to specified element将 webkit 滚动条样式应用于指定元素
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.