如何为每个容器创建不同的滚动条

Question

我在一个页面上有多个容器，我希望它们在每个容器中看起来都不同。 我在 Angular5 中开发，我尝试定义

::-webkit-scrollbar {  
   /*contents are different in each css file.*/
   ...
} 

进入每个 css 文件。（每个容器都包含在自己的组件中并使用自己的 css 文件。） 但他们看起来还是一样的。 我该如何解决它。 这真的很容易，但我不擅长 css 所以请帮助我。

Answer 1

html:

<div class="container sidebar">
 ...
</div>
<div class="container contents">
 ...
</div>

css:

.sidebar ::-webkit-scrollbar {
 ...
}
.contents ::-webkit-scrollbar {
 ...
}