html - css中的滚动条拇指高度

标签 html css angular-ui-bootstrap

scroll thumb 的高度是否根据可滚动区域设置为默认高度?如果没有,我可以设置滚动条拇指高度吗?如果可能怎么办?我尝试通过以下方式进行。

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

但是对页面没有影响。请帮忙。提前致谢。

最佳答案

我不这么认为,拇指的高度基于内容的大小,您可以更改 ::-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 */ }

css-tricks

enter image description here

Source

关于html - css中的滚动条拇指高度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/51503440/

相关文章:

html - 如何根据下拉列表中的选定数字生成表单输入字段(选择)

html - IOS Safari <select> 元素

css - 表格单元格在包含 float 元素时不遵守垂直对齐 CSS 声明

javascript - .prop ('selected' ) 不工作,按钮在 jquery 中一直被禁用

javascript - 使用 angularJS 结合 ui-bootstrap datepicker 和 timepicker?

javascript - 当我制作可拖动克隆时如何保留元素的高度和宽度

html - 如何在不同屏幕尺寸的页面上调整图像大小?

html - 使元素在 div 内向右浮动

css - 制作这种阴影的最佳方法是什么?

javascript - 如果悬停在其他链接上,需要停用点击功能