::-webkit-scrollbar {
width: 12px;
}
/* Track */
::-webkit-scrollbar-track {
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,70);
-webkit-border-radius: 10px;
border-radius: 10px;
}
/* Handle */
::-webkit-scrollbar-thumb {
-webkit-border-radius: 10px;
border-radius: 10px;
background: rgba(239,149,36,100);
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,30);
}
::-webkit-scrollbar-thumb:window-inactive {
background: rgba(255,0,0,30);
}
我在网上找到了这个修改滚动条样式的css。然而,它也改变了页面本身的滚动条,我需要它来改变菜单列表中的一个。菜单列表 id 是 "cssmenu"。这可能吗?请问如何?
最佳答案
只需在滚动规则之前使用任何选择器
.myscroll {
height: 1000px;
overflow: scroll;
}
.myscroll p {
height: 2000px;
}
.myscroll::-webkit-scrollbar {
width: 12px;
}
/* Track */
.myscroll::-webkit-scrollbar-track {
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,70);
-webkit-border-radius: 10px;
border-radius: 10px;
}
/* Handle */
.myscroll::-webkit-scrollbar-thumb {
-webkit-border-radius: 10px;
border-radius: 10px;
background: rgba(239,149,36,100);
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,30);
}
.myscroll::-webkit-scrollbar-thumb:window-inactive {
background: rgba(255,0,0,30);
}
<div class="myscroll">
<p>Content<p>
</div>
关于css - 仅更改菜单列表的滚动条,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32893241/