Question

有人可以告诉我如何调整滚动条拇指的高度吗？

我尝试了很多类似的事情

::-webkit-scrollbar-thumb {
    height: 10px;
}

::-webkit-scrollbar-thumb {
    max-height: 200px;
}


::-webkit-scrollbar-thumb {
    margin-top: 10px;
    margin-bottom: 10px;
}

我也已经阅读了Change scrollbar height和How to change the height of a scrollbar thumb?的答案，但是没有用。回答中的某些人说，无法更改滚动条拇指上的高度，然后不能更改此站点https://css-tricks.com/custom-scrollbars-in-webkit/的位置吗？

我当前的代码是

body {
  height: 110vh;
}

::-webkit-scrollbar {
    width: 1rem;
}

::-webkit-scrollbar-track {
    background: rgb(24, 24, 24);
}

::-webkit-scrollbar-thumb {
    background-color: #3EECAC;
    background-image: linear-gradient(19deg, #3EECAC 0%, #EE74E1 100%);
    border-radius: 1rem;
}

Answer 1

然后您的浏览器不支持它：

问这个：

您在使用Firefox吗？

滚动条是否在stackoverflow中更改：Change scrollbar height

（答案滚动条是否更改？）

::-webkit-scrollbar {
  -webkit-appearance: none;
  width: 7px;
}

::-webkit-scrollbar-thumb {
  border-radius: 4px;
  background-color: rgba(0, 0, 0, .5);
  box-shadow: 0 0 1px rgba(255, 255, 255, .5);
}
h1 {
  font-size: 1000px;
}

<h1>Test</h1>

如何更改滚动条的拇指高度？

1 个答案: