滚动条拇指高度在css中

Question

根据可滚动区域,滚动拇指的高度是否设置为默认值？如果没有,我可以设置滚动条拇指高度吗？如果有可能如何？我试着按照以下方式做到这一点.

body::-webkit-scrollbar-thumb {
  background-color: darkgrey;
  outline: 1px solid slategrey;
  height: 5px;
}

但它对页面没有影响.请帮忙.提前致谢.

Answer 1

我不这么认为,拇指的高度是基于内容的大小,你可以改变内部的宽度,::-webkit-scrollbar但高度将始终基于内容.

::-webkit-scrollbar              { /* 1 */ }
::-webkit-scrollbar-button       { /* 2 */ }
::-webkit-scrollbar-track        { /* 3 */ }
::-webkit-scrollbar-track-piece  { /* 4 */ }
::-webkit-scrollbar-thumb        { /* 5 */ }
::-webkit-scrollbar-corner       { /* 6 */ }
::-webkit-resizer                { /* 7 */ }

资源

Answer 2

如果您想在滚动时为滚动条拇指设置固定的最小高度。我们可以像下面这样设置：

::-webkit-scrollbar-thumb {
    min-height: 40px;
   }